-
编程语言
站-
热门城市 全国站>
-
其他省市
-
-
400-636-0069
小标
2018-12-26
来源 ：
阅读 1130
评论 0
摘要：本文主要向大家介绍了JAVA语言之AngularJs使用ng-checked实现全选或取消功能，通过具体的内容向大家展示，希望对大家学习JAVA语言有所帮助。
本文主要向大家介绍了JAVA语言之AngularJs使用ng-checked实现全选或取消功能，通过具体的内容向大家展示，希望对大家学习JAVA语言有所帮助。
AngularJs使用ng-checked一步实现全选或取消功能，代码如下;
01 <!doctype html>
02 <html lang="en">
03 <head>
04 <meta charset="UTF-8" />
05 <title>Document</title>
06 <style type="text/css">
07 .ng-cloak{display:none;}
08 td{height:30px;line-height:30px;padding:0px 10px;}
09 </style>
10 </head>
11 <body ng-app="app" ng-controller="ctrl" ng-cloak class="ng-cloak">
12 <table cellpadding="0" cellspacing="0" border="1">
13 <thead>
14 <tr>
15 <td>
16 <input type="checkbox" ng-model="all" />
17 <span ng-bind="all ? '取消' : '全选'"></span>
18 </td>
19 <td>名称</td>
20 <td>网址</td>
21 </tr>
22 </thead>
23 <tbody>
24 <tr ng-repeat="v in data">
25 <td><input type="checkbox" ng-checked="all" /></td>
26 <td>{{v.name}}</td>
27 <td>{{v.url}}</td>
28 </tr>
29 </tbody>
30 </table>
31 </body>
32 </html>
33 <script type="text/javascript" src="//www.zymseo.com/js/angular.min.js"></script>
34 <script type="text/javascript">
35 var m = angular.module('app', []);
36 m.controller('ctrl', ['$scope', function($scope){
37 $scope.data = [
38 {'name':'赵一鸣个人博客', 'url':'//www.zymseo.com'},
39 {'name':'赵一鸣新浪博客', 'url':'//blog.sina.com.cn/zhaoyimingtongxue'}
40 ]
41 }]);
42 </script>
本文由职坐标整理并发布，希望对同学们有所帮助。了解更多详情请关注编程语言JAVA频道！
喜欢 | 0
不喜欢 | 0
您输入的评论内容中包含违禁敏感词
我知道了
请输入正确的手机号码
请输入正确的验证码
您今天的短信下发次数太多了，明天再试试吧！
我们会在第一时间安排职业规划师联系您！
您也可以联系我们的职业规划师咨询：
版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com，All Rights Reserved.
沪公网安备 31011502005948号
索取资料
答疑解惑
技术交流
职业测评
面试技巧
高薪秘笈
