关于Angular中template variable reference的疑惑

我是大肥猫
  • 3
新手上路,请多包涵

大家好,有个奇怪的疑惑如下例:

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

如果在输入框任意输入,下方<p>中内容无变化,说明pin1.value没有值,间接说明#pin1这个variable reference没起到作用?

另一方面我们加一个event binding,立刻有效

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

这次输入框任意输入,下方<p>中内容相应变化,证明#pin2这个variable reference开始工作,事实上event handler可以是任意函数,例如:

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

也就是说只要且必须有event binding,variable reference才能起作用,请问这是为什么,另一个测试是:

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

任意输入无效,输入框失去焦点后立刻有效,所以我推断和event binding有关,与event种类和event handler具体实现无关,但是如何正确解释这个问题?我查看了官方doc也在stack overflow上提问了,可是无人回答= =,希望各位朋友帮忙,非常感谢!

回复
阅读 1k
1 个回答
我是大肥猫
  • 3
新手上路,请多包涵
✓ 已被采纳

我已解决了,感谢~

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏