如何在降级的Angular组件上实现ControlValueAccessor

时间:2018-02-15 18:30:09

标签: angular angular-components

我有一个实现ControlValueAccessor的Angular组件,但永远不会使用writeValue的初始值调用ngModel方法。

模板:

<my-comp [(ngModel)]="$ctrl.activeUser"></my-comp>

该组件通过以下方式降级为AngularJS:

.directive('myComp', downgradeComponent({
  component: MyComp,
  inputs: [],
  outputs: [],
}));

我尝试将ngModel添加到inputsoutputs,但它无效。

1 个答案:

答案 0 :(得分:4)

您应该使用[(ngModel)]属性而不是<my-comp ng-model="$ctrl.activeUser"></my-comp>,如下所示: * 3. `ng-model` is controlled by AngularJS and communicates with the downgraded Angular component * by way of the `ControlValueAccessor` interface from @angular/forms. Only components that * implement this interface are eligible. * * ## Supported Features * * - Bindings: * - Attribute: `<comp name="World">` * - Interpolation: `<comp greeting="Hello {{name}}!">` * - Expression: `<comp [name]="username">` * - Event: `<comp (close)="doSomething()">` * - ng-model: `<comp ng-model="name">`

来自角度文档:

{{1}}