这是一个模板示例:
<span count="{{currentCount}}"></span>
<span [count]="currentCount"></span>
这两个人都做同样的事情。哪一个是首选,为什么?
答案 0 :(得分:20)
$gnuplot --version
gnuplot 4.6 patchlevel 4
用于从父组件中的值绑定到子组件中的[]
。它允许传递对象。
@Input()
用于绑定属性和HTML中的字符串,如
{{}}
其中绑定可以是字符串的一部分。
<div somePropOrAttr="{{xxx}}">abc {{xxx}} yz</div>
用于绑定在触发DOM事件或子组件上的()
发出事件时调用的事件处理程序
EventEmitter
https://angular.io/docs/ts/latest/guide/template-syntax.html#!#binding-syntax
中的更多详情答案 1 :(得分:2)
主要了解以下内容:
插值是Angular转换为属性的一种特殊语法 捆绑。这是属性绑定的便捷替代方法。
这意味着在幕后它会产生相似的结果。但是,字符串插值有一个重要限制。这是首先将评估字符串插值中的所有内容(尝试从ts模型文件中查找值):
这对如何使用这两种方法有一些影响。例如:
带有字符串插值的字符串连接:
<img src=' https://angular.io/{{imagePath}}'/>
除字符串外,字符串插值不能用于其他任何用途
<myComponent [myInput]="myObject"></myComponent>
当myInput
是@Input()
的{{1}}时,如果要传递对象,则必须使用属性绑定。如果我们要使用字符串插值,则该对象将变成字符串,并将其作为myComponent
的值传递。
答案 2 :(得分:0)
战斗结束后我来得有点晚:),但是据我了解,还有另一个差异,有时可能非常重要。 顾名思义,“属性绑定”意味着您要绑定到HTML元素“对象”的属性(对应于DOM中的“目标”表示形式),wihch与字符串插值,可以应用于HTML元素标签属性,这就是为什么在与未解析/可解析的实体对话时只能在其中放入字符串的原因。
通常,您在这两者之间有直接对应关系(html中的标记具有foo属性,该属性链接到DOM对象的foo属性),但这不是一条规则,您可以拥有的属性不链接到属性以及相反的属性。
顺便说一句,您在堆栈溢出中有一个很好的答案,深刻解释了两者之间的区别:What is the difference between properties and attributes in HTML?