道招

AngularJS的controllerAs常见用法

如果您发现本文排版有问题,可以先点击下面的链接切换至老版进行查看!!!

AngularJS的controllerAs常见用法

我们一般用controllerAs多半是因为要用到我们的controller里面的数据,比如获取一个名叫cells.json,里面包含了所有手机的概况,我们需要获取这些数据以便ng-repeate它,一般我们可以在路由和指令里面使用。 先上模板页面cells.html
<ul>
    <li ng-repeat="cell in vm.cells">{{cell.name}},价格:{{cell.price}}</li>
</ul>
路由内容
'use strict';

angular
  .module('myApp', ['ngRoute', 'app.directive'])
  .config(['$routeProvider', function($routeProvider) {
    $routeProvider
      .when('/', {
        template: 'index'
      })
      .when('/cells', {
        template: '<cells-list></cells-list>',
        controller: ['Cells',
          function(Cells) {
            var vm = this
            vm.cells = Cells.query();
          }
        ],
        controllerAs: 'vm'
      })
  }])
指令内容
'use strict';

angular
  .module('app.directive', ['app.service'])
  .directive('cellsList', function() {
    return {
      templateUrl: 'view/cells.html',
      controller: ['Cells',
        function(Cells) {
          var vm = this
          vm.cells = Cells.query();
        }
      ],
      controllerAs: 'vm'
    }
  })
可以选择在路由里面用controller和controllerAs,或者在指令里面使用。 效果都是一样的 controller和controllerAs
更新时间:
上一篇:AngularJs的provider里面的装饰器decorator下一篇:angular表单验证$parsers和$validators方式区别

相关文章

emacs常用指令(快捷键)

不重动 Emacs 让 .emacs 配置文件生效 有四个函数可以做到: eval-last-sexp,eval-region,eval-buffer 和load-file M-x eva 阅读更多…

关注道招网公众帐号
道招开发者二群