ngFor循环出来的数组,在判断上区别可以自定义一个属性给循环出来的当前数组,供使用
来源:互联网 发布:p社 mac 编辑:程序博客网 时间:2024/06/09 19:19
例如:循环出来了一个列表,要求点击不同的项目时,被点击的背景色改变为黄色,字体颜色改变为白色。由于是ngFor循环的所以每一项的类和DOM都是相同的所以很容易造成所有颜色都改变。这个时候给当前的列表定义一个属性:list.classtype就是给list定义了classtype属性。然后在用循环遍历来确定当前点击的,将当前点击的和未点击的区分开来。然后进行样式和事件处理。
下面这个例子是对样式的改变。当点击某一个按钮的时候按钮颜色改变,其余颜色不变。
html:
<span *ngFor="let list of FQAList;let i=index" (click)="colorChange(i)"> <li *ngIf="list.hot=='1'"> <a [ngClass]="{'yellow':list.classtype}" href="{{WebUrl}}" >{{list.name}}</a> </li></span>ts
// 点击改变背景色public colorChange(i){ console.log(i);//接收到当前点击的下标 console.log(this.FQAList[i].type_id+"id"); this.FQAList[i].classtype = true; for(var j=0;j<this.FQAList.length;j++){ //做一个循环判断,当循环的j==i的时候改变背景色。不等的时候也就是其他值的情况下不改变 if(j != i){ this.FQAList[j].classtype = false; } }
阅读全文
0 0
- ngFor循环出来的数组,在判断上区别可以自定义一个属性给循环出来的当前数组,供使用
- java for循环里面的数组,并打印出来
- js把for循环出来的数据存入数组
- 弄清楚为什么字符串数组可以一起打印出来而整型数组还得用for循环
- struts2循环标签(将一个列表的内容在界面显示出来,自定义日期格式)
- 循环数组时,删除符合条件的当前元素
- 自己写了一个把文章标题从数据库中读出,并且赋值给一个数组,最后通过smarty循环显示出来
- 给for循环出来的html绑定事件
- js中把已知对象循环遍历出来再存入新的数组中
- 循环给数组赋值
- 一个技术小白整理出来的for循环使用几种方法~~
- leetcode动态规划之判断一个字符串是否是给定字符串数组组合出来的
- 指针符号在一维数组与二维数组上区别
- 使用$i循环控制读取出来的数据库条数
- 不良代码展示-不要用数组循环判断等于的方式,来判断一个对象是否在一个集合内
- 不要用数组循环判断等于的方式,来判断一个对象是否在一个集合内
- 一个循环实现新数组n位值是老数组前n位的和
- 判断一个数组是否为单一完全循环数组
- 哲学家就餐问题
- iOS 储存用户信息设置封装 直接调用即可(部分是代码片段)
- SQL语句查询数据库所有表和所有字段的详细信息(包括表描述和字段描述)
- 《Java从小白到大牛精简版》之第3章 第一个Java程序
- JAVA 数据结构
- ngFor循环出来的数组,在判断上区别可以自定义一个属性给循环出来的当前数组,供使用
- 利用OpenCV感知哈希算法进行图片相似度对比
- MongoDB数据库连接
- 树莓派新版系统上使用mjpg实现摄像头监控
- 我的Vim(Gvim) 配置
- ThinkPHP基础
- Java过滤器模式(条件模式)
- JS中判断字符串中出现次数最多的字符及出现的次数
- 数字图像处理研究的主要内容