0

一段时间以来，我一直被困在一个问题上，我无法弄清楚为什么会发生这种情况。

我的组件中有一个values: number[] = [10,10]变量。当我在 keyDown 上修改第一个输入时，它有时会将我的光标移动到下一个输入，或者它会失去焦点。

这是一个示例 Plunker：https ://embed.plnkr.co/N4PO5CNvn0WJChgNIo59/

编辑：当两个值相同时，光标移动到下一个输入。示例：10, 10。如果我输入任何数字，焦点将转移到下一个输入。顺便说一句，我正在使用 Chrome 最新版本

4

2 回答 2

3

我遇到了这个问题，幸运的是我记得如何解决它！

要解决这个问题，您需要定义一个自定义 trackBy 函数。

将此添加到您的 *ngFor 中：

*ngFor="let val of values; let i = index; trackBy: trackByFn"

在您的组件 TS 中：

trackByFn(index, item) {
  return index; // or item.id
}

刚刚在 plunkr 上测试过，效果很好！

于 2017-12-21T08:27:49.757 回答
-1

使用以下代码。

    import { Component, Input, Output, EventEmitter } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: "./app.component.html"
})
export class AppComponent {
    values: number[] = [10, 10];
    label: string;

    public updateValue(event, index) {
        this.values[index] = +event.target.value;
        console.log(this.values);
    }
}



<div class="field">
    <span *ngFor="let val of values; let i = index">
      <input type="number" [attr.name]="'test' + i" [value]="val" (change)="updateValue($event, i)" >,
    </span>
  </div>
于 2017-12-21T08:37:42.050 回答