Как использовать элемент простого элемента управления формы в качестве дочернего компонента в Angular? - PullRequest
0 голосов
/ 04 мая 2020

Я создал массив элементов управления и передал его управление каждым элементом дочернему компоненту, который имеет только тег ввода. Но я не могу контролировать вклад ребенка. Например, когда я использую простой массив, каждый дочерний ввод не показывает данные. Я надеюсь, что кто-то мне поможет.

  <div>
      <div *ngFor="let licenseCertControl of getUserCommonControls('licenseCert'); let i = index">
        <cg-common-entry [index]="i" [formControl]="licenseCertControl" [fieldName]="'licenseCert'"  (delete)="userCommonRemoved($event, i)" ></cg-common-entry>
      </div>
      <div class="add-more-link">
        <a (click)="addUserCommonControls('licenseCert')">Add More</a>
      </div>
  </div>

-Common Entry component

export class CommonEntryComponent implements OnInit, ControlValueAccessor {

  @Input()
  fieldName: String;

  @Input()
  index:Number = 0;

  @Input()
  showDelete:Boolean = true;

  @Output()
  delete = new EventEmitter<String>();

  private _onChange: Function;
  private _onTouched: Function;

  value:String = '';

  constructor( ) {
  }

  writeValue(value: String): void {
  }

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

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

  ngOnInit() { }

  deleteClicked() {
    this.delete.emit(this.fieldName);
  }
}
<div class="edit-input sw">

  <input type="text" [formControlName]="index" >

    <div *ngIf="showDelete" class="delete" (click)="deleteClicked()">
        <mat-icon class="delete-icon">delete</mat-icon>
    </div>
</div>

Я не уверен, какой из них мне нужно использовать для управления входом ребенка. [formControlName] или [formControl]? getUserCommonControls имеет массив элементов управления в форме строки, например ['hello', 'world'].

...