Как сохранить статус флажков при поиске в angular 8 - PullRequest
0 голосов
/ 20 апреля 2020

У меня есть поисковый ввод, который должен фильтровать список элементов флажков

<mat-dialog-content class="cfg-add-fields-dialog__content">
  <div class="cfg-add-fields-dialog__filter-input" role="search">
    <mat-form-field appearance="fill" class="cfg-add-fields-dialog__mat-form-field">
      <input type="search" matInput (keyup)="_applyFilter($event.target.value)" placeholder="Search"
        aria-label="Search" />
      <mat-icon matSuffix>search</mat-icon>
    </mat-form-field>
  </div>
  <mat-selection-list #matSelectionList role="listbox" (selectionChange)="
      _onSelectionChange(matSelectionList.selectedOptions.selected)
    ">
    <div *ngIf="items && items.length > 0">
      <mat-list-option #matOption checkboxPosition="before" *ngFor="let item of filteredItems$ | async" tabindex="-1"
        role="option" [value]="item">
        {{ item.name }}
      </mat-list-option>
    </div>
  </mat-selection-list>

когда я открываю свой диалог в конструкторе, я создаю переменную Observable.

  constructor(
    public dialogRef: MatDialogRef<CfgAddFieldsDialog>,
    @Inject(MAT_DIALOG_DATA) _data: any,
  ) {
    this.items = _data;
    this.filteredItems$ = combineLatest(
      this._itemsCollection,
      this._searchUpdated.pipe(debounceTime(DEBOUNCE_TIME_MS), startWith('')),
    ).pipe(
      map(([collection, searchText]) =>
        this._filterCollection(collection, searchText),
      ),
    );
    setTimeout(() => {

      this._itemsCollection.next(this.items);
    }, 50);
  }

  _filterCollection(collection: CfgFields[], searchText: string): CfgFields[] {
    return (collection = collection.filter(
      item =>
        item.name
          .toLocaleLowerCase()
          .indexOf(searchText.trim().toLocaleLowerCase()) !== -1,
    ));
  }

  _applyFilter(searchValue: string): void {
    /** adds the items from the input to the subject itemsCollection */
    this._searchUpdated.next(searchValue);
  }

Теперь моя проблема в том, чтобы установить флажок в списке и начать поиск другого элемента, а затем очистить условие поиска. При этом флажок, который я установил ранее, не сохраняется в своем состоянии.

Можете ли вы помочь мне, что я здесь пропустил?

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