Angular應用里的Template Reference Variable，模板引用變量，用于創(chuàng)建一個對模板里DOM元素或者Angular指令的引用。

使用#號定義一個模板引用變量。

看個具體的例子：

<input #phone placeholder=“phone number” />

定義了一個phone變量，指向input html元素。

在Component html模板的任意地方，都可以直接訪問模板引用變量。

<input #phone placeholder="phone number" /><!-- lots of other elements --><!-- phone refers to the input element; pass its `value` to an event handler --> <button (click)="callPhone(phone.value)">Call</button>

• If you declare the variable on a component, the variable refers to the component instance.
• If you declare the variable on a standard HTML tag, the variable refers to the element.
• If you declare the variable on an element, the variable refers to a TemplateRef instance, which represents the template.
• If the variable specifies a name on the right-hand side, such as #var=“ngModel”, the variable refers to the directive or component on the element with a matching exportAs name.

模板引用變量的生命周期是整個模板，這一點同模板輸入變量，比如*ngFor里的(let phone)不同，因此需要注意命名沖突。

除了#之外，另一種等價的語法是ref-fax，相當于#ref.

總結

以上是生活随笔為你收集整理的Angular应用里的Template Reference变量的全部內容，希望文章能夠幫你解決所遇到的問題。

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