无法绑定ngModel，因为它不是“component”[duplicate]的属性

Question

因此，我试图在angular 4中创建一个自定义表单组件，我添加了ngModel工作所需的所有内容，但它没有。

这是我的子组件：

export class Search extends ControlValueComponent {

}

它扩展到处理所有“ControlValueAccessor”的类ControlValueComponent。

这是类ControlValueAccessor：

import {ControlValueAccessor, NG_VALUE_ACCESSOR} from "@angular/forms";
import {forwardRef, Input} from "@angular/core";

export class ControlValueComponent implements ControlValueAccessor {

  @Input() disabled: boolean;

  innerValue: any = '';

  static providerValueAcessor( ref: any): any {
    return [
      { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ref), multi: true }
    ];
  }

  onTouchedCallback: () => void = () => {};

  onChangeCallback: (_: any) => void = () => {};

  constructor() {
  }

  get value(): any {
    return this.innerValue;
  }

  set value(v: any) {
    if (v !== this.innerValue) {
      this.innerValue = v;
      this.onChangeCallback(v);
    }
  }

  writeValue(value: any) {
    if (value !== this.innerValue) {
      this.innerValue = value;
    }
  }

  registerOnChange(fn: any): void {
    this.onChangeCallback = fn;
  }

  registerOnTouched(fn: any): void {
    this.onTouchedCallback = fn;
  }

}

为了获得提供程序权限，我使用函数ProviderValueAccessor（位于ControlValueComponent中）如下所示

providers: ControlValueComponent.providerValueAcessor(SysSearch)

但是，当我向子组件添加[(ngModel)]时，它总是得到错误，即ngModel不是该组件的属性

我试着这样用：

<search [(ngModel)] = 'value'><search>

Answer 1

我已经解决了这个问题。

我需要在调用子组件的父组件上直接导入FormsModule，以便ngModel工作...我是这样做的：

import {FormsModule} from "@angular/forms";


@NgModule({
  imports: [
    FormsModule,
    SearchModule
  ]

这样，父组件就能够使用ngmodel属性。谢谢你的帮助

Answer 2

在类文件中导入FormsModule：

null

import {ControlValueAccessor, NG_VALUE_ACCESSOR} from "@angular/forms";
---->
import {ControlValueAccessor, NG_VALUE_ACCESSOR, FormsModule} from "@angular/forms";