angularjs-指令ng-disable,ng-repeat,ng-checked

发布时间：2020-12-17 08:59:45 所属栏目：安全来源：网络整理

导读：#ng-disable禁用标签!DOCTYPEhtmlhtmlheadmetacharset="utf-8"/title/titlescriptsrc="js/angular.min.js"/script/headbodydivng-app="app"ng-controller="ctrl"同意：inputtype="checkbox"ng-model="status"ng-init="status=0"/br/inputtype="button"value=

#ng-disable禁用标签
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8"/>
<title></title>
<scriptsrc="js/angular.min.js"></script>
</head>
<body>
<divng-app="app"ng-controller="ctrl">
同意：<inputtype="checkbox"ng-model="status"ng-init="status=0"/><br/>
<inputtype="button"value="登陆"ng-disabled="!status"/>
</ul>
</div>

<scripttype="text/javascript">
varm=angular.module('app',[]);
m.controller('ctrl',['$scope',function($scope){
}]);

</script>
</body>
</html>

#ng-repeat标签，遍历对象
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8"/>
<title></title>
<scriptsrc="js/angular.min.js"></script>
</head>
<body>
<divng-app="app"ng-controller="ctrl">
<ul>
<ling-repeat="dinodata">
mynameis{{d.name}},iam{{d.age}}
</li>
</ul>
</div>

<scripttype="text/javascript">
varm=angular.module('app',function($scope){
$scope.odata=[
{'name':'cxiong','age':29},{'name':'xmzhang','age':29}
]
}]);

</script>
</body>
</html>

#ng-repeat标签，遍历数组
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8"/>
<title></title>
<scriptsrc="js/angular.min.js"></script>
</head>
<body>
<divng-app="app"ng-controller="ctrl">
<ul>
<!--报错：数组中存在重复元素，trackby$index-->
<ling-repeat="dinodatatrackby$index">
mynameis{{d}}
</li>
</ul>
</div>

<scripttype="text/javascript">
varm=angular.module('app',function($scope){
$scope.odata=['xmzhang','cxiong','fjwu','cxiong']
}]);

</script>
</body>
</html>

#ng-checked实现全选和反选
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8"/>
<title></title>
<scriptsrc="js/angular.min.js"></script>
</head>
<body>
<divng-app="app"ng-controller="ctrl">
<tableborder=""cellspacing=""cellpadding="">
<tr>
<th><inputtype="checkbox"ng-checked="status"ng-model="status"/>{{status}}</th>
<th><span>{{status?'取消':'全选'}}</span></th>
</tr>
<trng-repeat="dinodatatrackby$index">
<td><inputtype="checkbox"ng-checked="status"/></td>
<td>{{d}}</td>
</tr>
</table>
</div>

<scripttype="text/javascript">
varm=angular.module('app',function($scope){
$scope.status=true
$scope.odata=['xmzhang','cxiong']
}]);

</script>
</body>
</html>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!