鍍金池/ 問答/HTML5  HTML/ 關(guān)于Angular中template variable reference的疑惑

關(guān)于Angular中template variable reference的疑惑

大家好,有個(gè)奇怪的疑惑如下例:

<input #pin1 type="password">
<p>You entered: {{pin1.value}}</p>

如果在輸入框任意輸入,下方<p>中內(nèi)容無變化,說明pin1.value沒有值,間接說明#pin1這個(gè)variable reference沒起到作用?

另一方面我們加一個(gè)event binding,立刻有效

<input #pin2 type="password" (input)="test(pin2)">
<p>You entered: {{pin2.value}}</p>
where test=function(x){console.log(x);}

這次輸入框任意輸入,下方<p>中內(nèi)容相應(yīng)變化,證明#pin2這個(gè)variable reference開始工作,事實(shí)上event handler可以是任意函數(shù),例如:

<input #pin3 type="password" (input)="test()">
<p>You entered: {{pin3.value}}</p>
where test=function(){}

也就是說只要且必須有event binding,variable reference才能起作用,請問這是為什么,另一個(gè)測試是:

<input #pin4 type="password" (blur)="test()">
<p>You entered: {{pin4.value}}</p>
where test=function(){}

任意輸入無效,輸入框失去焦點(diǎn)后立刻有效,所以我推斷和event binding有關(guān),與event種類和event handler具體實(shí)現(xiàn)無關(guān),但是如何正確解釋這個(gè)問題?我查看了官方doc也在stack overflow上提問了,可是無人回答= =,希望各位朋友幫忙,非常感謝!

回答
編輯回答
小眼睛

我已解決了,感謝~

2018年3月12日 02:15