Warum gibt ngModelChange den vorherigen Wert der Eingabe aus?

Question

Ich habe eine (sehr) einfache Angular2-Komponente mit nichts als einem Textfeld. Ich möchte, dass jedes Mal, wenn Änderungen an diesem Feld vorgenommen werden, die Konsole den Wert des Feldes protokolliert. IE wenn jemand "ABCD" eingibt, sollte die Konsole loggen: "A", "AB", "ABC", "ABCD".

Ich sehe jedoch, dass die Konsole den PREVIOUS-Wert des Felds protokolliert, bevor die neue Eingabe registriert wurde. Stattdessen bekomme ich: "", "A", "AB", "ABC".

Wie kann ich es so machen, dass die Konsole den Wert des Textfelds protokolliert, nachdem das neue Zeichen eingegeben wurde?

Vielen Dank.

Mein Code so weit:

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

Änderung Ihrer Methode zu

(ngModelChange)="onTextChange($event)" 

und in Komponentenklasse

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

Answer 2

Änderung der Methode von

(ngModelChange)="onTextChange()" 

je nachdem, wo Sie den Wert von Form console.log, ich glaube, Sie einen "Fehler", wenn Sie geschrieben haben Ihre Frage (??) eingereicht, und tatsächlich meinen Sie, dass Sie diese Methode in Ihrem html haben:

Aber wie auch immer, ch Angegeben an:

(keyup)="emitDataValue()" 

scheint es zu funktionieren, wie Sie es wünschen.