CODE EXAMPLE FOR TYPESCRIPT

multi select + search + Multiselect and Search in angular 13

  <mat-form-field style="display:none;">
                <mat-label>Select Dealer</mat-label>
                <mat-select [formControl]="dealerIdForSpas" multiple disableOptionCentering
                  [disabled]="LineItemsWithLoadTypeList.length==0">
                  <mat-option *ngFor="let item of DealersLookUpDataList" [value]="item.company"
                    (onSelectionChange)="filterPartsLoad()">
                    {{item.company}}
                  </mat-option>
                </mat-select>
              </mat-form-field> 

              <mat-form-field appearance="fill">
                <mat-label>Select Dealer</mat-label>
                <input type="text" id="searchDealer" #dealerSpas autocomplete="off" aria-label="Number"
                  placeholder="Select Dealer" matInput [formControl]="dealerIdForSpas"
                  [matAutocomplete]="autodealerIdForSpas">
                <mat-autocomplete #autodealerIdForSpas="matAutocomplete">
                  <mat-option *ngFor="let option of dealerfilteredOptionsForSpa | async" [value]="option.company"
                    (click)="selectdealerIdForSpas(option)" multiple>
                    {{option.company}}
                  </mat-option>
                </mat-autocomplete>
              </mat-form-field> 

              <!-- [(ngModel)]="selectedItems" -->
              <div class="col-md-9" style="background-color: white;">
                <ng-multiselect-dropdown [placeholder]="'Select Dealer'" [settings]="dropdownSettings"
                  [data]="dropdownList" [formControl]="dealerIdForSpas" (onSelect)="onItemSelect($event)"
                  (onSelectAll)="onSelectAll($event)">
                </ng-multiselect-dropdown>
              </div>


  dealerfilteredOptions: Observable<any[]>;
  dealerfilteredOptionsForSpa: Observable<any[]>;
  public AllCarrierDataList: any[] = [];
  public options: any[] = [];

  this.dealerfilteredOptions = this.dealerId.valueChanges
      .pipe(
        startWith(''),
        debounceTime(200),
        distinctUntilChanged(),
        map(valueGot => {
          debugger
          this.options = this._filterDealersList(valueGot);
          if (this.options !== undefined) {
            return this.options.slice(0, 40);
          }
        })
      );

    this.dropdownSettings = {
      singleSelection: false,
      defaultOpen: false,
      idField: 'dealerid',
      textField: 'company',
      selectAllText: 'Select All',
      unSelectAllText: 'UnSelect All',
      itemsShowLimit: 99999,
      allowSearchFilter: true
    };