angular 中的*ngFor指令的使用

<ul>

  <li *ngFor="let item in items">{{item}}</li>

</ul>

有时候需要获取index,比如删除本行li列表的时候需要根据index来确定删的是哪个

<ul>
<li *ngFor="let item of items; let i = index">
{{item}}
<i (click)="deleteThis(i)">x</i>
</li>
</ul>
private items = ["张三","李四","王五","赵六","李七"];

deleteThis(index){
console.log(index);
this.items.splice(index,1) //根据数组的index来删除对应的元素
}

把列表遍历出来显示到页面,点击每个列表对应的x就可以删除本条记录

angular4 *ngFor获取index的更多相关文章

  1. 排序并获取index的顺序

    //排序并获取index的顺序:4,7,2,9-->9,7,4,2-->4,2,1,3 Array.prototype.getIndex=function(){ var orderLeng ...

  2. elementui el-upload 在v-for里使用时 如何获取index

    <div v-for = 'item in list'> <div @click="getImageTypeIndex(index)"> <el-up ...

  3. java增强for循环中获取index

    java增强for循环中获取index http://rensanning.iteye.com/blog/2003205

  4. [Angular 2] *ngFor with index

    Let's see how to track index when we use 'ngFor: <li *ngFor="#hero of heros | async, #i = in ...

  5. Thymleaf中th:each标签遍历list如何获取index

    简单介绍:传递给后台一个String类型的list,需要获取到list的每一个元素,然后进行筛选,得到正确的文本值,看代码就明白了 代码: //后台java代码//failList是一个String类 ...

  6. 微信小程序获取index索引值的方法

    功能:点击某一项,底部出现粉色边框 首先需要通过 bindtap 为每一个item项绑定一个点击事件,其次需要添加自定义属性 data-* = {{index}} ,以便在函数中获取到被点击item项 ...

  7. Thymeleaf中each标签遍历list如何获取index

    <tr th:each="user,userStat:${users}">userStat是状态变量,有 index,count,size,current,even,o ...

  8. layer弹出层 获取index

    function closelayer(){ var index = parent.layer.getFrameIndex(window.name); parent.layer.close(index ...

  9. java8在Stream的forEach操作时获取index

      import java.util.Objects; import java.util.function.BiConsumer; /** * * @author yangzhilong * @dat ...

随机推荐

  1. 构建SqlSessionFactory 的过程

    1 SqlSessionFactory 的核心功能是创建 SqlSession 接口,而 SqlSessionFactory 是通过 SqlSessionFactoryBuilder 去构建. 构建步 ...

  2. spine 所有动画的第一帧必须把所有能K的都K上

    spine 所有动画的第一帧必须把所有能K的都K上.否则在快速切换动画时会出问题.

  3. linux学习规划

  4. 大数据量下MySQL插入方法的性能比较

    不管是日常业务数据处理中,还是数据库的导入导出,都可能遇到需要处理大量数据的插入.插入的方式和数据库引擎都会对插入速度造成影响,这篇文章旨在从理论和实践上对各种方法进行分析和比较,方便以后应用中插入方 ...

  5. 动态修改 dom 元素的伪类样式

    最近写代码,需要修改伪类的 content 属性,不想定义两个样式进行切换,而是直接通过 js 进行修改. html 中的伪类(如 a:hover / a:link / class::before / ...

  6. jquery 给表格tbody t 加事件

    jquery给所有td加事件 $('#erji_list_table').on('click','td', function(){ $('#yuan_content').slideToggle(&qu ...

  7. 基于vitamio的网络电视直播源代码

    这个项目是基于vitamio的网络电视直播源代码.也是一个使用了vitamio的基于安卓的网络直播项目源代码,可能如今网上已经有非常多类似这种视频播放应用了.只是这个还是相对来说比較完整的,希望这个案 ...

  8. [boostrap]debian下为arm创建debian和emdebian文件系统

    转自:http://www.cnblogs.com/qiaoqiao2003/p/3738552.html Debian系统本身包含对arm的支持,其包含的软件包最多,但是最终的文件系统要大一些. e ...

  9. 16c554 的头文件

    //------------------------------------------------------------------------------ #ifndef AT16C554H # ...

  10. Modsecurity原理分析--从防御方面谈WAF的绕过(一)

    0x00 背景知识 一说到WAF,在我们安全工作者,或者作为普通的白帽子来说,就很头疼,因为好多时候,我们发到服务端的恶意流量都被挡掉了,于是就产生了各种绕“WAF”的话题,绕来绕去,也就无非那么多种 ...