To bind to a DOM event, surround the DOM event name in parentheses and assign a quoted template statement to it.

語法：將dom事件的名稱用圓括號包裹起來，再附上一個加上了雙引號的模板聲明。

例子：

<button (click)=“onClickMe()”>Click me!

看另一個例子：

<h3>Jerry Template reference variable test</h3><input #box (keyup)="0"><p>{{box.value}}</p>

運行效果：

當用戶在input字段輸入值時，輸入值會自動出現在input element正下方的p element里。

然而template reference變量#box之后的 (keyup)="0"的含義是什么？

Angular updates the bindings (and therefore the screen) only if the app does something in response to asynchronous events, such as keystrokes. This example code binds the keyup event to the number 0, the shortest template statement possible. While the statement does nothing useful, it satisfies Angular’s requirement so that Angular will update the screen.

原來，Angular框架只有當應用響應某些同步或者異步事件，比如鍵盤敲擊，鼠標點擊時才會更新綁定信息進而刷新屏幕。因此為了使上面的例子能夠工作，需要將keyup事件綁定到一個template statement上，即使該statement不做任何事情，即最簡單的"0".

總結

以上是生活随笔為你收集整理的Angular如何响应DOM event的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。