模型绑定类似于 属性 绑定的语法

Model binding like syntax for the property binding

我正在从事 Metronic Theme's Angular 6 项目。它具有以下代码。你能告诉我 [(action)]="action" 的功能是什么吗?我知道如何绑定到输入元数据(即 @Input())。我们通常是这样

<m-login *ngIf="action === 'login'" [action]="action"></m-login>

但这里不一样。这就像 2 向模型绑定。但是我们通常对 [(ngModel)]="model" 使用这种语法。有什么线索吗?

auth.component.html

<m-login *ngIf="action === 'login'" [(action)]="action"></m-login>

login.ts

export class LoginComponent implements OnInit, OnDestroy {

    @Output() actionChange = new Subject<string>();
    @Input() action: string;

}

Can you tell me what is the functionality of [(action)]="action"

此功能称为双向数据绑定

更多信息:Two Way Binding

You often want to both display a data property and update that property when the user makes changes.

On the element side that takes a combination of setting a specific element property and listening for an element change event.

Angular offers a special two-way data binding syntax for this purpose, [(x)]. The [(x)] syntax combines the brackets of property binding, [x], with the parentheses of event binding, (x).

The two-way binding syntax is really just syntactic sugar for a property binding and an event binding. Angular desugars the binding into this:

如果你的 属性 名字是 action,你只需要将它对应的 EventEmitter 命名为 actionChange 并为子组件 [(action)] = "parentProperty" 和 Angular 负责其余部分。