标签:script value function body false select text sel 默认
作用:规定Angular范围 创建多个ng-app时默认只执行第一个 可用模块合并解决 <body ng-app="app"> <div ng-controller="demo1" ng-click="demo1()"></div> <div ng-controller="demo2" ng-click="demo2()"></div> <script src="../bower_components/angular/angular.js"></script> <script type="text/javascript"> angular.module(‘app1‘, []).controller(‘demo1‘, [‘$scope‘, function($scope){ console.log(11111); }]); angular.module(‘app2‘, []).controller(‘demo2‘, [‘$scope‘, function($scope){ console.log(22222); }]); //模块合并 angular.module(‘app‘, [‘app1‘, ‘app2‘]); </script> </body>
/* http://www.angularjsapi.cn/#/ngRepeat $index number 循环的索引值 $first boolean 是否第一次循环 $middle boolean 是否第一次和最后一次循环之间的循环。 $last boolean 是否最后一次循环。 $even boolean 是否循环的次数$index为偶数。 $odd boolen 是否循环的次数$index为奇数 */ <body ng-app="app"> <ul ng-controller="demo1Controller"> <li ng-repeat="value in data"> <span>{{$first ? $index : ‘‘}}</span> <span>{{value.id}}</span> <span>{{value.name}}</span> <span>{{value.age}}</span> </li> </ul> <script src="../bower_components/angular/angular.js"></script> <script type="text/javascript"> angular.module(‘app‘, []).controller(‘demo1Controller‘, [‘$scope‘, function($scope){ $scope.data = []; for (var i = 10 - 1; i >= 0; i--) { var obj = { id: i, name: ‘名字是:‘ + i, age: ‘年龄是:‘ + i }; $scope.data.push(obj); } }]) </script> </body>
<!--1、如果表达式是一个字符串,字符串应该是一个或多个空格分隔的类名称。--> <!--2、如果表达式是数组,数组中的每个元素应该是一个字符串,即一个或多个空格分隔的类名称。--> <!--3、如果表达式是一个对象,应用相应的类名称作为key 值为true或false。--> <!--4、如果特定类别已被设置,该指令将不会添加重复类。--> <style type="text/css"> .red { color: red; } .green { color: green; } </style> </head> <body ng-app="app"> <!-- ng-class: 会根据当前设置对象的属性和属性值决定是否添加特定类名 --> <ul ng-controller="demo1Controller" > <li ng-repeat="value in data" ng-class="{red:$even,green:$odd}"> <span>{{value.id}}</span> <span>{{value.name}}</span> <span>{{value.age}}</span> </li> </ul> <script src="../bower_components/angular/angular.js"></script>
1 <style> 2 .red{ 3 background-color: red;} 4 5 .green{ 6 background-color: green;} 7 8 #box{ 9 height: 200px; 10 width: 200px;transition:background-color 1s ease; 11 } 12 </style> 13 </head> 14 <body ng-app> 15 <select ng-model="style"> 16 <option value="red">红色</option> 17 <option value="green">绿色</option> 18 </select> 19 20 <!-- <div id="box" ng-class="style"></div> --> 21 <div id="box" ng-class="{red:style==‘red‘, green:style==‘green‘}"></div> 22 23 <script src="bower_components/angular/angular.js"></script> 24 </body>
标签:script value function body false select text sel 默认
原文地址:http://www.cnblogs.com/UFO-NO1/p/6056267.html