全选和反选

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. BeatifulSoup模块

    一.介绍 Beautiful Soup 是一个可以从HTML或XML文件中提取数据的Python库.它能够通过你喜欢的转换器实现惯用的文档导航,查找,修改文档的方式.Beautiful Soup会帮你 ...

  2. MySql在windows上的安装

    知乎安装教程 csdn安装教程 一.官网下载 ZIP Archive 内的软件包,mysql-xxx-win64.zip. 二.新建 MySQL 文件夹,解压缩下载包,进入文件夹(mysql-8.0. ...

  3. java URI

    URI是对URL的抽象,不仅包括统一资源定位符,还包括统一资源名,在java中URI用java.net.URI类表示,这个类与java.net.URL类的区别表现在: URI类完全有关于资源的标识和U ...

  4. unity 3D 学习笔记

    1.父对象的初始位置设,即刚开始的空对象的根节点位置应当设置成(0,0,0) 这样设置可以避免以后出现奇怪的坐标. GameObject实际上就是一些组件的容器. unity 使用公用变量原因是,在U ...

  5. mysql 文件导入

    load data infile 文件路径 into table 表 fields terminated by ',' lines terminated '\n'

  6. Happiness

    1575: Happiness 时间限制: 1 Sec  内存限制: 1280 MB 题目描述 Chicken brother is very happy today, because he atta ...

  7. vsftpd中的local_umask和anon_umask

    umask是在linux中常见的一个东西,它其实是一个掩码.当然,也有umask这样一个命令,它是对用户建立的文件的默认属性的定义.该 定义为: 假设umask为022,则对于一个文件夹的话,它的默认 ...

  8. C++ Primer 笔记——枚举类型

    1.和类一样,每个枚举类型定义了一种新的类型.枚举属于字面值常量类型. 2.C++包含两种枚举:限定作用域的和不限定作用域的.C++11新标准引入了限定作用域的枚举类型. }; // 限定作用域的枚举 ...

  9. azkaban使用

    新建一个text文件,a.job,打包成zip包传到azkaban即可 方式1:job流   1. a.job内容范例: type=command command=hive shell command ...

  10. 使用python调用shell判断当前进程是否存在

    使用subprocess模块判断当前进程是否存在 #! /usr/bin/env python import subprocess res = subprocess.Popen(r'ps -ef |g ...