在Angular中，如何使自定义组件[（ngModel）]应用了一个简单的标志？

Question

在Angular中，如何将模板简单的自定义组件应用于[（ngModel）]？我希望这个[（ngModel）]是一个简单的布尔标志。然后在单击div时更改此ngModel。要添加到现有组件的最小代码是什么？

Answer 1

我真的不明白[(ngModel)]的必要性如果你想将一个布尔值绑定到组件之外，建议使用Angular双向绑定https://angular.io/guide/template-syntax#two-way-binding---

在您的布尔标志案例中：

@Input()  flag: boolean| string;
@Output() flagChange = new EventEmitter<boolean>();
changeFlag() {
  this.flag = !this.flag;
  this.flagChange.emit(this.flag);
}

在相应的父组件中，您可以使用与[（ngModel）]相同的语法来使用此属性：

[(flag)]

[（ngModel）]是[ngModel]属性和（ngModelChange）事件的糖。