Angular2表單變量不工作沒有ngModel

<form #f="ngForm"> 
    <input type="text" name="dd" value="abc" (change)="foof(f.form.value)"/> 
</form>

然而，f.form.value無關，在它的時候，當我改變輸入文本值foof函數被調用。只有當我添加ngModel到輸入元素像下面，

<input type="text" name="dd" [ngModel]="abc" (change)="foof(f.form.value)"/>

然後f.form.value有DD輸入文本值。我不明白這是爲什麼。我是否必須使用ngModel才能使表單變量正常工作？

注：對於我們的應用程序的某些原因，我們必須提交整個表單當DD輸入被改變，所以我需要foof（f.form.value）。我也不希望雙向綁定，只是由於模型和html佈局之間的差異而導致的一種方式綁定。

2016-12-30 vanval

我想你可以做一個黑客就像這樣：

<form #f="ngForm"> 
    <input type="text" id="someInput" value="abc" (change)="foof()"/> 
</form>

和

x:any; 

foof() { 
    this.x = document.getElementById("someInput"); 
    console.log(this.x.value); 
}

不知道你的應用程序，所以這個（可怕的）黑客可能根本不適合你的需求。

2016-12-30 20:15:46 Alex

謝謝！這解決了這個問題，同時解決了另一個問題，對我來說，我必須有跨多個組件的形式傳播，並沒有採用反應的形式，但模板驅動的形式。使用JavaScript做到了這一點！ – vanval

太棒了！很高興我能幫上忙！ :) – Alex

我不認爲這是你應該如何被綁定到一個輸入字段。

你應該這樣做了，

<input type="text" name="dd" [(ngModel)]="abc" (ngModelChange)="foof(abc)"/>

2016-12-30 18:44:38 Steveadoo

對於我們的應用程序的某些原因，我們必須提交整個表單當DD輸入被改變，所以我需要foof（f.form.value）。我也不想雙向約束力，只是一個由於模型和HTML佈局之間的差異結合的方式。 – vanval

回答