ng2-auto-complete ngModel 不改变值答案

【问题标题】：ng2-auto-complete ngModel does not change valueng2-auto-complete ngModel 不改变值
【发布时间】：2017-09-11 06:51:49
【问题描述】：

我正在使用 ng2-auto-complete 模块。当用户从查找数据（自动完成）中选择一个值时，我有一个验证表单并想要更改 ngModel 值。

我不想通过 valueChangedEvent 更改值，因为我不止一次使用这个模块。我想将我的 ngModel 与自动完成值绑定。这怎么可能？

这不起作用：

<div ng2-auto-complete 
  [source]="getValue('country')"
  placeholder="enter text">
  <input [(ngModel)]="person.country" />
</div>

如果我选择一个值，则 person.country 不会改变。

提前谢谢！

【问题讨论】：

标签： angular angular2-template angular2-forms

【解决方案1】：

您可以尝试在这样的输入事件上使用函数：

<input [(ngModel)]="person.country" #myInput (input)="changeModel(myInput.value)"/>

// TS
changeModel(value: string) { this.person.country = value; }

或者你可以使用 OnChange 实现

export class MyClass implements OnChanges {
    // ...
    ngOnChanges(changes: SimpleChanges) { this.person.country = changes.allResults.currentValue; }
}

【讨论】：

我正在使用这个自动完成功能 15 次。这意味着，我必须为每个条目编写一个 onchange 方法。这正是我不想做的。
或者，由于您可能学会了如何编码，因此您创建了一个具有 2 个参数的函数，第二个是您要更新的属性。
你有代码示例或解释它的网站吗？
男人，认真的吗？ (input)="changeModel(myInput.value, person.country)" 和函数 changeModel(value: string, property: string) { property = value; }
谢谢。我之前已经尝试过，但我忘记将值声明为属性。如果选择数据，则输入事件不起作用。我用 valueChangedEvent 解决了它。

【解决方案2】：

像这样更改您的代码

<div 
  placeholder="enter text">
  <input [(ngModel)]="person.country" ng2-auto-complete 
  [source]="getValue('country')" />
</div>

ng2-auto-complete 标记和来源应与输入字段一起提供。

【讨论】：