angular4 radio checkbox 有用
<span *ngFor="let op of [{'id':'a','text':'11'},{'id':'b','text':'2222'},{'id':'cc','text':'3333'}]" class="form-check">
<input type="checkbox" [name]="value" [checked]="model.indexOf(op.id) > -1" (click)="setValue(op)"
[value]="op.id"/>{{op.text}}{{model| json}}
</span>
setValue(option: any) {
const {id} = option;
const index = this.model.indexOf(id);
if (index > -1) {
// 有则移出
this.model.splice(index, 1);
this.onChange(this.model); // 需更新绑定的值
} else {
// 无则添加
this.model.push(id);
this.onChange(this.model); // 需更新绑定的值
}
}
<!-- <span *ngFor="let op of [{'id':'a','text':'a11'},{'id':'b','text':'bbb'}]" class="form-check">
<input type="radio" [(ngModel)]="value" name="value" [value]="op.id" />
{{value}}{{op.text}}
</span> -->
angular4 radio checkbox 有用的更多相关文章
- :radio :checkbox
匹配所有单选按钮 示例 描述: 查找所有单选按钮 HTML 代码: <form> <input type="text" /> <input typ ...
- jSP的3种方式实现radio ,checkBox,select的默认选择值。
jSP的3种方式实现radio ,checkBox,select的默认选择值.以radiao 为例:第一种方式:在jsp中使用java 脚本,这个方法最直接,不过脚本太多,不容易维护<%Stri ...
- 检查radio/checkbox是否至少选择一项
//---------------------------------------------------------- // 功能:检查radio/checkbox是否至少选择一项 // 参数: / ...
- 微信小程序 - radio/checkbox自定义组件
更新 2019-01-26:首次发布 2019-01-27:增加默认取值选中radio/checkbox,checkbox需在onload取值 2019-01-28:增加radio取值不存在红色提示和 ...
- 【TP3.2+onethink】radio+checkbox+select 空间 编辑页面选中,附录 js 返回上一页
1.TP3.2框架 如何实现 [radio+checkbox+select 空间 编辑页面选中],说实话,比较繁琐,不咋地!! 不废话,上代码:(其中 XX_arr 变量一维数组) <div ...
- jQuery radio|checkbox的取值与赋值
文章简单即是美[我说的是技术博客] |--radio |--checkbox 参考: http://blog.csdn.net/gd2008/article/details/6951208 h ...
- 自定义radio/checkbox样式
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- Jquery操作radio,checkbox,select表单操作实现代码
一 .Select jQuery获取Select选择的Text和Value: 1. $("#select_id").change(function(){//code...}); / ...
- jquery 判断多组radio checkbox是否选中
最近要做一个问卷调查的小页面,需要判断用户是否每项都有选择,如果每个都挨个判断很苦逼,所以网上搜了搜,自己也总结了一下,写了一段小代码~哈哈,水平有限大家见谅.html代码就不上了,N多单选和多选框就 ...
随机推荐
- AtCoder - 2705 Yes or No
Problem Statement You are participating in a quiz with N+M questions and Yes/No answers. It's known ...
- [CF607D]Power Tree
题目大意: 一棵树初始只有一个编号为$1$的权值为$w_1$的根.$q(q\le2\times10^5)$次操作,每次可以给出$v,w(w<10^9)$,新建一个结点作为$v$的子结点,权值为$ ...
- Java 输入框复用代码
1 int messageType=JOptionPane.INFORMATION_MESSAGE; String message=mines + " minutes is approxim ...
- FCL研究-LINQ-System.Linq Enumerable
.net 里面集合操作极为方便,尤其是实现了IEnumerable接口的集合,一直在使用,系统的研究一下集合的操作也是极好的. 类型 操作符名称 投影操作符 Select,SelectMany 限制操 ...
- JS面向对象之闭包
闭包 闭包的概念 闭包的含义就是闭合,简单来说就是一个具有封闭功能的结构 闭包就是具有封闭的对外不公开的,包裹结构或空间 在 js 中的闭包 在 js 中函数可以构成闭包 函数是一个代码结构的封闭结构 ...
- VisualSVN设置提交时必须输入log信息
在别人的基础上修改的: 自己在Windows上用VisualSVN搭了个服务器,默认提交代码是可以不填任何信息,这可不是我所期望的,于是找到了下面的解决方案: 在VisualSVN的管理控制台中可以设 ...
- mac 切换默认python版本
https://www.zhihu.com/question/30941329 首先终端的“python”命令会执行/usr/local/bin下的“python”链接,链接相当于win下的快捷方式, ...
- Zabbix的SNMPTrap监控配置
SNMPTrap监控主要用于设备发生故障时的主动通知的监控.以下简单记录下Zabbix的SNMPTrap的配置方法. 一.SNMPTrap监控的处理流程说明 1.监控对象发送SNMPTrap信息到sn ...
- 自己做的roguelike+恶魔城游戏《魔塔猎人》已发布。
游戏仍然是标准的roguelike,死亡后回到出生点重新开始,宏观架构上参考了<死亡细胞>,战斗设计上更加强调轻重攻击的组合,再配合236和28系列的搓招技.空中的突进飞腿.副武器等等. ...
- webpacke install vue application 报错 Failed at the phantomjs-prebuilt@2.1.14 install script
刚刚在网上下了个开源的项目: https://github.com/ing670/webappkiller 执行npm install 报错:npm ERR! Failed at the phanto ...