栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

输入更改时Angular2动态输入字段会失去焦点

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

输入更改时Angular2动态输入字段会失去焦点

当数组是原始类型(在您的情况下是

String
数组)时,会发生这种情况。这可以通过使用解决
TrackBy
。因此,更改模板以匹配以下内容:

<div *ngFor="let value of field.values; let i=index; trackBy:trackByFn">    <input type="text" [(ngModel)]="field.values[i]"  /><br/></div><div>    <button (click)="addValue(field)">Click</button></div>

并在ts文件中添加函数

trackByFn
,该函数返回值的(唯一)
index
值:

trackByFn(index: any, item: any) {   return index;}

这是关于同一问题的 链接
,除了该问题是针对AngularJS的,但该问题与您的情况相同。该页面最重要的摘录:

您正在数组上重复,并更改了数组的项目(请注意,您的项目是字符串,它们是JS中的基元,因此“按值”进行比较)。由于检测到新项目,因此从DOM中删除了旧元素,并创建了新元素(显然,它们没有得到关注)。

使用

TrackBy
Angular可以根据唯一标识符跟踪已添加(或删除)了哪些项目,并仅创建或销毁了已更改的内容,这意味着您不会失去对输入字段的关注:)

如链接所示,您还可以修改数组以包含唯一的对象

[(ngModel)]="value.id"
(例如,使用),但这也许不是您所需要的。



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/442332.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号