模板中的Angular 2标签是什么意思？ [英] What does Angular 2 hashtags in template mean?

问题描述

我正在使用angular 2，并且找到类似于

 < input #searchBox（keyup）=search （searchBox.value）
  

它可以工作。

但是，我不明白 #searchBox 的含义。我没有在文档中发现任何明确的内容。

任何人都可以向我解释它是如何工作的吗？

感谢

解决方案

这是在Angular 2模板系统中使用的语法，它将dom元素声明为变量。 b

在这里我给我的组件一个模板url

  import'Component'from'angular2 / core' ; 
 $ b @Component（{
选择器：'harrys-app'，
 templateUrl：'components / harry / helloworld.component.html'
}）
 
导出类HarrysApp {} 
  

模板呈现HTML。在模板中，您可以使用数据，属性绑定和事件绑定。这是由以下sytax完成的：

＃ - 变量声明

（） - 事件绑定

[]


[（）] - 双向属性绑定

{{}} - 插值

* - 结构指令

＃语法可以声明引用DOM对象的局部变量名在模板中。
E.g。

 < span [hidden] =harry.value> *< / span> 
< input type =text＃harry> 
 {{harry.value}} 
  

I am working with angular 2 and I have found something like

<input #searchBox (keyup)="search(searchBox.value)"

and it works.

However, I don't understand the meaning of #searchBox. I haven't found anything clear neither in the doc.

Could anyone explain to me how it works?

Thanks

解决方案

It's syntax used in the Angular 2 templating system which declares dom elements as variables.

here i give my component a template url

import {Component} from 'angular2/core';

@Component({
   selector: 'harrys-app',
   templateUrl: 'components/harry/helloworld.component.html'
})

export class HarrysApp {}

Templates render HTML. In a template you can use data, property binding and event binding. This is occomplished with the following sytax:

# - variable declaration

() - event binding

[] - property binding

[()] - two-way property binding

{{ }} - interpolation

* - structural directives

The # syntax can declare local variable names which references DOM objects in a template. E.g.

 <span [hidden]="harry.value">*</span>
 <input type="text" #harry>
 {{ harry.value }}

这篇关于模板中的Angular 2标签是什么意思？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！