Question

我有一个（非常）简单的Angular2组件，只有一个文本字段。我想要它，以便每次对此字段进行任何更改时，控制台都会记录该字段的值。 IE如果有人键入“ABCD”，控制台应记录：“A”，“AB”，“ABC”，“ABCD”。

然而，我看到的情况是控制台在注册新输入之前记录字段的PREVIOUS值。所以相反，我得到：“”，“A”，“AB”，“ABC”。

我怎样才能使控制台在输入新字符后记录文本字段的值？

非常感谢你。

到目前为止我的代码：

import { Component, OnInit, ViewChild, EventEmitter, Output } from '@angular/core';
import { NgForm } from '@angular/forms';

@Component({
  selector: 'modal-test-form',
  template: `
    <form>
      <input name="data" placeholder="Type something" ngModel (ngModelChange)="onTextChange()"/>
    </form>
  `,
  //templateUrl: './modal-test-form.component.html',
  styleUrls: ['./modal-test-form.component.css']
})
export class ModalTestFormComponent{
  @ViewChild(NgForm) testForm : NgForm;

  constructor() { }

  onTextChange() {
    console.log(this.testForm.form.value);
  }

}

Answer 1

将您的方法更改为

(ngModelChange)="onTextChange($event)"

并在组件类

中

onTextChange(val: string): any {
  console.log("updated value is --->", val);
}

Answer 2

从

更改方法

(ngModelChange)="onTextChange()"

根据你在哪里控制。从表单中记录值，我想你已经写了一个＆＃34;错误＆＃34;当你提交你的问题（??），实际上你的意思是你在你的html中有这个方法：

(ngModelChange)="emitDataValue()"

但无论如何，将其改为：

(keyup)="emitDataValue()"

它似乎按照你希望的方式工作。

为什么ngModelChange会发出先前的输入值？

2 个答案: