Question

我有一个简单的应用程序，当在文本框中按下回车键时，它会将文本框值添加到列表框。这是我的HTML代码

<input type="text" value="{{ myText }}" (keypress)="keyEvent($event)"  /> 
<select multiple="multiple" >
  <option *ngFor="let item of itemsList">
    {{item}} 
  </option>
</select>

这是我的打字稿组件代码

export class AppComponent {
  title = `hello world app !`;
  myText ='';
  itemsList = [];constructor() { 
  }

  ngOnInit() {
  }

  keyEvent(event)
  {
    if(event.keyCode === 13)
    {
      event.preventDefault(); // Otherwise the form will be submitted
      this.itemsList.push(this.myText);
    }
  }

myText值未更新。该值始终为null。

请帮助弄清楚在绑定myText时我缺少的是什么。

Answer 1

它没有更新，因为您需要通过ngModel 双向数据绑定：

<input type="text" [(ngModel)]="myText"  p  (keypress)="keyEvent($event)"  />

了解更多信息：https://angular.io/api/forms/NgModel

在Angular

1 个答案: