Angularjs 学习笔记-2017-02-05-初识Angular及app、model、controller、repeat指令和fileter、orderBy...

ng-app   定义作用域，从作用域处开始执行ng命令指令

ng-model 数据绑定字符，用于双向数据绑定

ng-controller ng控制台，定义function name（$scope）来填充controller内容。

ng-repeat 循环读取{{i in $scope.xx}}  or {{i in [0,1,2,3,4]}}  or　　{{i in ["aa","bb","cc"]}}

　　　　　　|filter:modelName 绑定查询标签

 

filter:

ng-repeat="phone in phones |filter:query

绑定的name与当前ng-controller或ng-app一致，当在controller中定义时，

只能在controller内可以获取到值，相当于在方法体内定义变量和在ng-app下定义公共变量

orderBy:

ng-repeat="phone in phones |orderBy:orderPro

绑定的name与当前ng-controller或ng-app一致，当在controller中定义时，

只能在controller内可以获取到值，相当于在方法体内定义变量和在ng-app下定义公共变量

 $scope 

 

Q:ng-repeat  重复读取

　　

 

 1 <div ng-app>
 2     Hello {{'World'}}!
 3 
 4 
 5     Your name:<input type="text" ng-model="yourname" placeholder="World" />
 6     <hr />
 7     Hello   {{ yourname || 'World'}}!  {{99*5}}
 8 
 9     <div ng-controller="PhoneListCtrl">
10         <ul>
11             <li ng-repeat="phone in phones">
12                 <span>{{phone.name}}</span>
13                 <p>
14                     {{phone.snippet}}
15                 </p>
16             </li>
17         </ul>
18     </div>
19 
20     <p>Total number of phones: 2</p>
21 </div>
22 <script type="text/javascript">
23     function PhoneListCtrl($scope) {
24         $scope.phones = [
25             { "name": "Nokia", "snippet": "Most memory when we was young" },
26             { "name": "Motorola", "snippet": "Hello MOTO" },
27             { "name": "XiaoMi4", "snippet": "Made in China" }
28         ];
29     }
30 </script>
31 <script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>

View Code

 A:ng版本原因，引用官方地址时出现此问题，引用本地其他版本时无此问题。

　　<script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>

转载于:https://www.cnblogs.com/mailaidedt/p/6364723.html