Angular Не найден провайдер для NgControl в NodeInjector

Я пытаюсь использовать пользовательский компонент выбора на основе Angular Material в реактивной форме. Вот мой пользовательский компонент выбора:

SelectInputComponent.ts

      export class SelectInputComponent implements OnInit {

@Input() data: any;
@Input() label: string;
@Input() optionsKey: any;
@Input() optionsValue: any;

constructor(@Self() public ngCongrol: NgControl) {
  this.ngCongrol.valueAccessor = this;
}

ngOnInit() {
}

writeValue(obj: any): void {}
registerOnChange(fn: any): void {}
registerOnTouched(fn: any): void {}

}

Селектинпуткомпонент.html

      <mat-form-field class="{{classNamesParent}}" appearance="fill" >
  <mat-label>{{label}}</mat-label>
  <mat-select value="{{data}}" [formControl]="ngCongrol.control">
    <mat-option *ngFor="let option of optionsKey" value="option">
       {{optionsValue[option]}}
    </mat-option>
  </mat-select>
</mat-form-field>

И вот как я использую это в EditProfileComponent.html:

        <app-select-input [label]='"Gender"' [optionsKey]="enumGenderKeys" 
     [optionsValue]="enumGenderValues" [data]="member.gender">
  </app-select-input>

Должен сказать, что у меня есть еще один пользовательский компонент ввода текста, который объявлен в том же модуле, что и компонент select, но с компонентом ввода текста проблем нет.

Общий модуль.ts

      @NgModule({
 declarations: [
   NavComponent,
   SelectInputComponent,
   TextInputComponent,
 ],
 imports: [
  CommonModule,
  RouterModule,
  ReactiveFormsModule,
  MatDatepickerModule,
  MatNativeDateModule,
  MatFormFieldModule,
  MatInputModule,
  MatSelectModule,
  MatAutocompleteModule,
 ],
 exports:[
   ToastrModule,
   NavComponent,
   SelectInputComponent,
   TextInputComponent,
 ]
})
export class SharedModule { }

Я получаю следующую ошибку в консоли, и, насколько мне известно, она связана со службами и, в моем случае, с инъекцией @Self() public ngCongrol: NgControlв конструкторе причина проблемы.

ядро.js:6498

         ERROR Error: NG0201: No provider for NgControl found in NodeInjector. Find more at https://angular.io/errors/NG0201
at throwProviderNotFoundError (core.js:245:1)
at notFoundValueOrThrow (core.js:3329:1)
at lookupTokenUsingModuleInjector (core.js:3364:1)
at getOrCreateInjectable (core.js:3466:1)
at Module.ɵɵdirectiveInject (core.js:14756:1)
at NodeInjectorFactory.SelectInputComponent_Factory [as factory] (select-input.component.ts:10:34)
at getNodeInjectable (core.js:3561:1)
at instantiateAllDirectives (core.js:10298:1)
at createDirectivesInstances (core.js:9647:1)
at ɵɵelementStart (core.js:14900:1)

0 ответов

Другие вопросы по тегам