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

Question

我正在研究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;

}

Answer 1

  

你能告诉我[（action）] =“ action”

的功能是什么

此功能称为双向数据绑定

有关更多信息：Two Way Binding

  

您通常希望既显示数据属性又更新它   用户进行更改时的属性。

     

在元素侧需要结合设置特定的   元素属性并侦听元素更改事件。

     

Angular为此提供了一种特殊的双向数据绑定语法，   [（X）]。 [[x）]语法结合了属性绑定的括号，   [x]，带有事件绑定的括号（x）。

Answer 2

  

双向绑定语法实际上只是一个语法糖   属性绑定和事件绑定。角形减震器的绑定   进入这个：

如果您的属性名称为action，则只需将其对应的EventEmitter命名为actionChange，然后对子组件{{1 }}，而Angular负责其余的工作。