javascript
angularJS（5）
一，數據循環：特別要注意作用域
使用ng-repeat指令。
<div ng-app="myApp" ng-controller="myCtrl"><ul><li ng-repeat="x in names">{{x}}</li></ul> </div> <script> var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) {$scope.names=["金角大王","銀角大王","紅孩兒"]; }); </script>二：angularJs控制器
1.AngularJS 應用程序被控制器控制。
2.ng-controller?指令定義了應用程序控制器。
控制器使用方法：
<div ng-app="myapp" ng-controller="myctrl">姓：<input type="text" ng-model="xing"><br>名：<input type="text" ng-model="ming"><h1>你的姓名是：{{xing+""+ming}}</h1><h2>好孩子：{{aaa()}}</h2> </div> <script>var app=angular.module("myapp",[]);app.controller("myctrl",function($scope){$scope.xing="孫";$scope.ming="悟空";$scope.aaa=function(){return $scope.xing+$scope.ming+“喜歡吃香蕉";}}) </script>接下來咱來解析一下這個案例：
AngularJS 應用程序由?ng-app?定義。應用程序在 <div> 內運行。
AngularJS 指令用于定義一個控制器:ng-controller="myctrl"?
myctrl?函數是一個 JavaScript 函數。
AngularJS 使用$scope?對象來調用控制器。
在 AngularJS 中， $scope 是一個應用對象(屬于應用變量和函數)。
控制器的?$scope?（相當于作用域、控制范圍）用來保存AngularJS Model(模型)的對象。
控制器在作用域中創建了兩個屬性 (xing?和?ming)。
ng-model?指令綁定輸入域到控制器的屬性（xing 和 ming）.
?
三，DOM指令。
1，ng-disabled指令：直接綁定應用程序數據到HTML的disabled屬性。
<body ng-app="myapp" ng-controller="mctrl"><input type="button" value="下一步" ng-disabled="!mm"/><input type="checkbox" ng-model="mm"/></body><script type="text/javascript">var app=angular.module('myapp',[]);app.controller('mctrl',function ($scope) {});</script>2，ng-hide指令（隱藏元素）
<body ng-app="myapp" ng-controller="myctrl"><input type="checkbox" ng-model="mm" />隱藏<div ng-hide="mm"><h4>八百標兵奔北坡</h4></div></body><script type="text/javascript">var app=angular.module('myapp',[]);app.controller('myctrl',function ($scope) {})</script>3，ng-show指令：根據value的值來顯示（隱藏）HTML元素；可以使用表達式來計算布爾值（true或false）。
<body ng-app="myapp" ng-controller="myctrl"><input type="checkbox" ng-model="mm"/>顯示<div id="" ng-show="mm"><h2>窗前明月光</h2></div></body><script type="text/javascript">var app=angular.module('myapp',[]);app.controller('myctrl',function ($scope) {})</script>4,angularJs顯示隱藏
（1）ng-hide 指令用于設置應用部分是否可見。
???? ? ??ng-hide="true" 設置 HTML 元素不可見。
???? ? ??ng-hide=“false” 設置 HTML 元素可見。
（2）ng-show?指令可用于設置應用中的一部分是否可見?。
????? ?ng-show="false"?可以設置 HTML 元素?不可見。?
?????? ng-show="true"?可以以設置? HTML 元素可見。
?轉
轉載于:https://www.cnblogs.com/alinaxia/p/6241031.html
總結
以上是生活随笔為你收集整理的angularJS（5）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： ConcurrentHashMap 内部
- 下一篇： JS中绑定事件顺序（事件冒泡与事件捕获区