gulp+webpack+angular1的一点小经验(第三部分使用一些angular1的插件ui-bootstrap与highcharts)

  第一个要介绍的是咱们的麻烦制造器:angular-ui-bootstrap
  ui-bootstrap能够有不少通用的插件给你们用,好比弹窗啊(modal),翻页控件啊(pagination),为何说它麻烦呢,由于它家官网被墙了,看不到文档!可我就是要用啊,怎么办?老办法,下载来再说:html

npm install --save-dev angular-ui-bootstrap

  而后到mode_modules文件夹里找到这家伙,好比我要用pagination:node

\node_modules\angular-ui-bootstrap\src\pagination\docs\demo.html

  每一个里边都有个例子文件,供你们学习使用,看了之后就知道怎么用了。还有这个modal,网上都是这样的代码注入:$modal,但是实际上demo里的是这样:$uibmodal(血与泪的经验,没文档好难过)。
  
  第二个要介绍的是:highcharts
  说一下怎么在这里用highcharts绘图表:网上查了不少资料,首先:web

npm install highcharts-ng

  用以在angular中做为依赖引入:npm

var statisticModule = angular.module('statisticModule', [require('highcharts-ng')]);

  而后就一直报这个Chart未定义的错误,搞了很久,原来意思是:这个highcharts-ng并非highcharts的主体,而是highcharts的一个插件而已,因此还要引入highcharts的主体,那好:bootstrap

npm install --sava-dev highcharts

  而后代码里:svg

var statisticModule = angular.module('statisticModule', [require('highcharts'),require('highcharts-ng')]);

  这样仍是不行,报错很明显。。。网上查了说:要引入一个commonjs版的highcharts,好的。。。学习

npm install --sava-dev commonjs-highcharts

  仍是不行。。。而后我仔细想了一下,highcharts自己并不用导入angular,有highcharts-ng作代理,这个应该这么写:ui

require('commonjs-highcharts');
var statisticModule = angular.module('statisticModule', [require('highcharts-ng')]);

  顺利出图了。谢谢各位网友的无私奉献!spa

相关文章
相关标签/搜索