zoukankan      html  css  js  c++  java
  • angular6 数组遍历项进行双向绑定 丢失焦点 问题解决

    学习angular6,漫长并充实的过程,今日发现一个问题

    数组['aaa','bbb','ccc']遍历后,每个项都和input进行双向绑定,为什么改变input值,这个数组
    里面的项(值变量)不改变;如果是[{a:'aaa'},{b:'bbb'},{c:'ccc'}],这样的项(引用型变量)
    遍历后每个项进行双向绑定就可以实现表单改变项的值,数组也改变

    办法总比困难多!

    搜索资料和文献发现

    方法1

    [(ngModel)]="item[index]

    方法1确实能够解决绑定的问题,但是又发现另外一个问题,每次表单修改项的时候,表单只=值一旦改变,表单就丢失了焦点,很不友好,探索发现方法2

    方法2
    *ngFor="let value of values; trackBy:indexTracker" indexTracker(index: number, value: any) { return index; }

    这种自定义trackBy的方式才是正确的路子,既保证了项的绑定,也能避免数组持续的从头遍历刷新,完美解决!

  • 相关阅读:
    springboot1.x+dubbo案例
    dubbo相关的博文
    druid监控配置
    Tomcat启动报错整理
    Hibernate @OneToMany等注解设置查询过滤条件等
    异常处理
    复杂的xml转化为java实体
    简单Java类与XML之间的转换
    mysql errno 150
    JdbcTemplate进行查询
  • 原文地址:https://www.cnblogs.com/junjun-001/p/14185009.html
Copyright © 2011-2022 走看看