学习AngularJS之Controller之概念理解之首篇

阅读更多
Controller 在 AngularJS 中是一个非常核心的概念。如何理解?

大家知道 AngularJS 是基于数据而对页面上对元素进行操作、互动的(双向绑定)。Controller 是谁的 Controller 呢?对,是页面上一个元素(作为数据对视图部分)的 Controller。页面上的元素是 Angular 的最小操作单元,是数据的视图层,是展示数据的模版,这个模版文件就要绑定一个 Controller 。


代码-模版部分
被标记了 ng-XXX 的元素,已不再是一个普通的元素,而是 angular 用来展示数据的视图层模版。
每一个模版,都要对应一个 Controller。






Key - {{key}} Val - {{value}}
{{$index}} - {{record}}


代码:逻辑部分
var app = angular.module("myApp", []);

//This is my view controller 1 under my angular app!
app.controller("myApp-myCtrl-1", function($scope) {
  $scope.myObj = {
    "Name" : "Alfreds Futterkiste",
    "Country" : "Germany",
    "City" : "Berlin"
  }
});

//This is my view controller 2 under my angular app!
app.controller("myApp-myCtrl-2", function($scope) {
  $scope.records = [
    "Java",
    "C++",
    "Python",
    "Php",
  ]
});



学习AngularJS之Controller之概念理解之首篇_第1张图片





完整代码:
在线测试: http://www.runoob.com/angularjs/ng-ng-repeat.html









Key - {{key}} Val - {{value}}
{{$index}} - {{record}}







转载请注明,
原文出处:http://lixh1986.iteye.com/admin/blogs/2427034

































-
  • 学习AngularJS之Controller之概念理解之首篇_第2张图片
  • 大小: 40.8 KB
  • 查看图片附件

你可能感兴趣的:(AnguarJS,Controller,ng-repeat)