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

发表评论

电子邮件地址不会被公开。 必填项已用*标注