全选和反选

BUG:当鼠标点击其中一个选项后,在点击全选按钮,该选项失效

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>
<div ng-app="hd" ng-controller="ctrl">

<input type="text" ng-model="user.email" ng-readonly="user.uid"/>
<hr/>
<table>
<tr>
<td>
<input type="checkbox" ng-model="all" >
<span ng-bind="!all?'全选':'取消'"></span>
</td>
<td>名称</td>
<td>网址</td>
</tr>
<tr ng-repeat="v in data">
<td><input type="checkbox" ng-model="all"></td>
<td>{{v.name}}</td>
<td>{{v.url}}</td>
</tr>
</table>
</div>
<script>
var m=angular.module('hd',[]);
m.controller('ctrl',['$scope',function($scope){
$scope.user={name:'百度',uid:1,email:'11111@qq.com'};

$scope.data=[{name:'百度',url:'baidu.com'},
{name:'新浪',url:'sina.com'},
{name:'搜狐',url:'souhu.com'},
{name:'博客',url:'blog.com'}
];
}]);
</script>
</body>
</html>

angular笔记_5(全选/反选)的更多相关文章

  1. JavaScript、全选反选-课堂笔记

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. jQuery全选反选实例

    1. $('#tb:checkbox').each(function(){ 每次都会执行 全选-取消操作,注意$('#tb :checkbox').prop('checked',true); tb后面 ...

  3. 关于input全选反选恶心的异常情况

    上一篇讲到:第一次点击全选按钮input显示对勾,第二次则不显示,需要用prop来添加checked属性. 但是用prop会出现一个问题,对勾显示,而checked属性不会被添加(比如:$(" ...

  4. jQuery全选/反选checkbox

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. python: jquery实现全选 反选 取消

    引入这个jquery-1.12.4.js jquery实现全选 反选 取消 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitio ...

  6. BootStrapt iCheck表单美化插件使用方法详解(含参数、事件等) 全选 反选

    特色: 1.在不同浏览器(包括ie6+)和设备上都有相同的表现 — 包括 桌面和移动设备 2.支持触摸设备 — iOS.Android.BlackBerry.Windows Phone等系统 4.方便 ...

  7. 用javascript实现全选/反选组件

    以下是本人制作的全选/反选 组件,供广大同行参考.指正: 效果如图: 在实现的过程中,全选和全部取消选中这两个功能较为简单,只需用for循环遍历所有复选框为true或false即可.反选也较为简单,也 ...

  8. jquery、js操作checkbox全选反选

    全选反选checkbox在实际应用中比较常见,本文有个不错的示例,大家可以参考下 操作checkbox,全选反选//全选 function checkAll() { $('input[name=&qu ...

  9. jquery、js全选反选checkbox

    操作checkbox,全选反选 //全选 function checkAll() { $('input[name="TheID"]').attr("checked&quo ...

随机推荐

  1. python并发编程之多进程2-------------数据共享及进程池和回调函数

    一.数据共享 1.进程间的通信应该尽量避免共享数据的方式 2.进程间的数据是独立的,可以借助队列或管道实现通信,二者都是基于消息传递的. 虽然进程间数据独立,但可以用过Manager实现数据共享,事实 ...

  2. 【git】提交代码到远程仓库

    看完不用,就是一个字:忘! 之前学了两天git结果今天要用的时候,啥也想不起来.... 场景: 已有远程仓库: git@192.168.1.1:test/test.git 要提交代码到远程仓库的新分支 ...

  3. 谷歌、火狐浏览器 缩放为80% 时,margin值才正确

    声明:小白的笔记,欢迎大神指点.联系QQ:1522025433. 在网页布局中,通过 谷歌浏览器或火狐浏览器 预览时,发现我们定义的盒模型width,height,margin,padding 值都是 ...

  4. Spring声明式事务@Transactional 详解,事务隔离级别和传播行为

    @Transactional注解支持9个属性的设置,这里只讲解其中使用较多的三个属性:readOnly.propagation.isolation.其中propagation属性用来枚举事务的传播行为 ...

  5. Jmeter BeanShell PostProcessor提取json数据

    需求:提取sample返回json数据中所有name字段值,返回的json格式如下: {“body”:{“apps”:[{“name”:”111”},{“name”:”222”}]}} jmeter中 ...

  6. 80端口被占用 导致apach无法启动问题

    1.查找是哪个程序占用了80端口 netstat -ano 列出所有进程 观察 “本地地址” 列 找到对应的PID 我这里是4 简单的办法,打开任务管理器,查看PID是4的 是哪个进程. 发现是Sys ...

  7. python 把类当作 装饰器

    # class Test(object): # def __call__(self): # print('-----test----') # t= Test()# t() 调用主要有个__call__ ...

  8. Oracle数据库表索引失效,解决办法:修改Oracle数据库优化器模式

    ALTER SYSTEM SET OPTIMIZER_MODE=RULE scope=both; 其他可以选择的模式还有ALL_ROWS/CHOOSE/FIRST_ROWS/ALL_ROWS. 应用系 ...

  9. The authenticity of host 'slaver2 (192.168.199.132)' can't be established. RSA key fingerprint is cc:4e:23:01:ca:97:52:21:85:78:bc:29:ca:b3:12:52.

    1:ssh登录 The authenticity of host 192.168.199.132 can't be established. 的问题 问题出现了,总要解决吧,百度一下,详细介绍的很多, ...

  10. Vue2.0 探索之路——生命周期和钩子函数的一些理解

    前言 在使用vue一个多礼拜后,感觉现在还停留在初级阶段,虽然知道怎么和后端做数据交互,但是对于mounted这个挂载还不是很清楚的.放大之,对vue的生命周期不甚了解.只知道简单的使用,而不知道为什 ...