Angular Фильтр по умолчанию для автозаполнения материала не работает - PullRequest
0 голосов
/ 20 апреля 2020

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

HTML:

<form (ngSubmit)="submit()" [formGroup]="pacientForm">
    <label class="example-radio-group">Disease</label>
              <input type="text"
               matInput
               [(ngModel)]="pacient.disease"
               formControlName="disease"
               [matAutocomplete]="auto">
        <mat-autocomplete #auto="matAutocomplete">
          <mat-option *ngFor="let option of filteredDiseaseOptions | async" [value]="option">
            {{option}}
          </mat-option>
        </mat-autocomplete>

TS:

pacientForm: FormGroup = new PacientCreateFormBuilder().build();
pacient: Pacient;
diseaseOptions: string[] = ['first', 'second', 'third'];
filteredDiseaseOptions: Observable<string[]>;

ngOnInit(): void {
    this.filteredDiseaseOptions = this.pacientForm.valueChanges
      .pipe(
        startWith(''),
        map(value => this._filter(value))
      );
  }

private _filter(value: string): string[] {
    const filterValue = value.toLowerCase();

    return this.diseaseOptions.filter(option => option.toLowerCase().includes(filterValue));
  }

FormGroup:

export class PacientCreateFormBuilder {

  public build(): FormGroup {
    return new FormGroup({
      disease: new FormControl('', []),
    });
  }

}

1 Ответ

0 голосов
/ 20 апреля 2020

Я думаю, вам нужно this.filteredDiseaseOptions = this.pacientForm.get('disease').valueChanges().

disease - это имя элемента формы, на которое вы хотите подписаться.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...