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. Python 爬虫实例(6)—— 爬取蚂蚁免费代理

    数据库表sql语句: CREATE TABLE `free_ip` ( `free_ip_id` int(11) NOT NULL AUTO_INCREMENT COMMENT '主键', `ip` ...

  2. Linux硬盘速度测试的命令

    测试下硬盘的读写速度如何,在linux下可以使用hdparm 对硬盘进行测试或查看硬盘的相关信息. hdparm 命令进行硬盘速度测试.参数: -a 表示是否关闭磁盘预读取功能.对于大文件读取,这个显 ...

  3. 跑酷游戏的一些bug总结(滥用FixedUpdate的坑)

    最近把1年前的跑酷游戏demo拿出来重做了一遍,解决了2个之前的遗留bug. 虽然罪魁祸首都是FixedUpdate,但细节又不太一样.这里记录一下 1.点击空格键,角色会跳跃.而有时会跳的比之前高很 ...

  4. 【Android】15.2 广播

    分类:C#.Android.VS2015: 创建日期:2016-02-29 一.简介 Android系统和你自己编写的应用程序都可以通过Indent发送和接收广播信息.广播的内容既可以是自定义的信息, ...

  5. 线程相关函数(6)-pthread_cond_wait(),pthread_cond_signal(), 条件变量

    pthread_cond_tpthread_cond_initpthread_cond_destroypthread_cond_waitpthread_cond_timedwaitpthread_co ...

  6. Taking A Fresh Look At What Open Source API Management Architecture Is Available

    http://apievangelist.com/2014/10/05/taking-a-fresh-look-at-what-open-source-api-management-architect ...

  7. 读取大csv文件数据插入到MySql或者Oracle数据库通用处理

    import java.io.BufferedInputStream; import java.io.BufferedReader;import java.io.BufferedWriter;impo ...

  8. JavaScript 框架 jQuery 的下载和安装

    jQuery 简介: jQuery 是一个 JavaScript 库. jQuery 极大地简化了 JavaScript 编程. jQuery 很容易学习. jQuery 下载: // 官网: htt ...

  9. 16V554 的测试代码

    //------------------------------------------------------------------------ #include   "AT16C554 ...

  10. m4--宏处理器

    m4 是 POSIX 标准中的一部分,所有版本的 UNIX 下都可用.虽然这种语言可以单独使用,但大多数人需要 m4 仅仅是因为 GNU autoconf 中的 “configure” 脚本依赖它.宏 ...