Angular 带方括号和不带方括号的属性指令语法[]

属性指令应该使用选择器和

选择器：'[myDirective]'

语法，然后在模板中使用，如

'

。我还看到ngClass是一个属性指令，用法类似于

[ngClass]=“'class1 class2'”

。我想知道何时使用方括号，何时不使用。它是否与指令选择器和同名属性绑定之间的某种关系有关？

当需要计算表达式时，使用方括号ngClass可以在没有括号的情况下使用。下面的代码将class1和class2视为普通字符串

ngClass="class1 class2"

---

我认为这取决于你与什么样的实体合作。 在选择器中，您可以在处理组件时写入：

selector:'[myComponent]'  => <div myComponent></div>

选择器：'[myComponent]'=>

或

选择器：'myComponent'=>

当涉及到属性绑定时，您可以编写

<div [title]="theTitleProperty"></div>

将html标题属性绑定到components属性theTitleProperty的值。（alt div title=“{{theTitleProperty}}”） 当

将为标题赋予值“theTitleProperty”

ngClass的另一种选择是

<div [class]="theClassProperty"></div>

然后它将@输入到一个组件。 任何组件都可能有@Input，您可以将其与括号一起使用，也可以不使用 如果您有一个带有@Input（）aText:string的组件； 您可以这样使用它：

<my-component [aText]="myTextProperty"></div>

它会将控件属性myTextProperty发送到components@Input 但是如果你这样写

<my-component aText="myTextProperty"></div> 

它会将myTextProperty发送到组件中

---

希望对您有所帮助

为什么这里不需要单引号？因为ngClass没有方括号，angular会将class1 class2视为普通字符串。如果有括号，它将把它们当作变量。

<my-component [aText]="myTextProperty"></div>

<my-component aText="myTextProperty"></div>