尖括号[](){}它们绑定的内容以及何时使用 [英] The angular brackets [] () {} what they bind and when to use which

问题描述

我看到方括号用于数据绑定，但有什么不同？

下面的代码片段是我经常使用的。但大多数都是在不了解原因的情况下记录在案的。

• [class]="myclass"
• (ngModelChange)="mymodel"
• [(ngModel)]="mymodel2"
• <ion-input placeholder="{{'INPUT_TEXT' | translate}}"/>
• <button>{{'BUTTON_TEXT'|translate}}</button>

推荐答案

上述所有语法都可以在page的这个page角度文档中找到。如果您愿意，您可以在其他博客上阅读有关ANGLE的模板语法的更多信息。

1)[class]="myclass"

方括号[.]表示从组件逻辑(数据)到视图(目标元素)的one-way属性绑定。

2)(ngModelChange)

这表示event binding，它允许目标侦听某些事件，如单击和按键。

3)[(ngModel)]="mymodel2"

这表示two-way data binding，它组合了上述两种语法。该属性的数据将显示在视图上，同时，当用户进行任何更改时，该属性也将更新。

4)<ion-input placeholder="{{'INPUT_TEXT' | translate}}"/>

您只需将另一个组件导入到当前组件中，placeholder属性将被分配组件属性INPUT_TEXT到template interpolation的值。

pipe operator (|)允许您对显示的值进行转换。管道接受输入并返回相应的转换值

5)类似于4。

这篇关于尖括号[](){}它们绑定的内容以及何时使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！