ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

Angualr 内置工具-SelectionModel

2020-05-18 17:52:07  阅读:255  来源: 互联网

标签:内置 SelectionModel value 判断 选中 Angualr 方法


SelectionModel: 被用来控制选中一个和多个item时候的逻辑。例如下拉菜单,复选框选中等,非常方便。

引入:import{SelectionModel}from'@angular/cdk/collections';

声明:private checkSelection = new SelectionModel<string>(true, []); // 一个选中的集合,可以很方便处理选中和非选中,甚至用来判断全选的状态。

内置方法

select(value) 选中一个值到集合里面

deselect(value) 取消选中

toggle(value) 选中和非选中之间切换

clear() 清除所有选中的值

isSelected(value) 判断是否选中,并返回一个boolean值

hasValue() 判断selectModel是否有值

sort(function) 根据一个方法进行排序

除此之外,还有监测选中的方法,SelectionChange(),同SelectionModel一样需要事先引入。

 
/* 假如我有一个checkbox组件, * checked:输入属性,判断是否选中 * change: 代表事件输出,Event emit * 简单使用方法如下 */
<checkbox-component [checked]="checkSelection.isSelected(id)" (change)="checkSelection.toggle(id)"></checkbox-component>

 

   

标签:内置,SelectionModel,value,判断,选中,Angualr,方法
来源: https://www.cnblogs.com/yinghuochongfighter/p/12912048.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有