Mat自动完成搜索无效,没有错误

时间:2018-09-06 13:06:22

标签: html angular mat-autocomplete

我的HTML

  <div class="row">
    <div class="input-field col s10">
      <div class="form-group">
        <div formArrayName="sensors_id">
          <div *ngFor="let sensor of addHomeboxPForm.get('sensors_id').value; let i = index">
            <br>
            <input formControlName="{{i}}" type="text" placeholder="Select Sensor" aria-label="Number" matInput [matAutocomplete]="auto">
            <mat-autocomplete autoActiveFirstOption #auto="matAutocomplete" [displayWith]="displayWith">
              <mat-option (onSelectionChange)="updateForm($event, [sensor.sensors_id], 'sensors_id')" *ngFor="let sensor of filteredOptionsS | async" [value]="sensor.sensor_serial">
                {{sensor.sensor_serial}}
              </mat-option>
            </mat-autocomplete>
            <div class="button-left">
              <button *ngIf="addHomeboxPForm.controls.sensors_id.value.length > 1" type="button" class="fa" (click)="onRemoveItem(i)">RemoveSensor</button>
            </div>
          </div>
        </div>
      </div>

我的过滤器:

  private _filterS(value: string): Sensors[] {
    const filterValue = value.toString().toLowerCase();

    return this.sensors.filter(sensors => sensors.sensor_serial.toLowerCase().indexOf(filterValue) === 0);
  }


  this.filteredOptionsS = this.addHomeboxPForm.get('sensors_id').valueChanges.pipe(
    startWith(''),
    map(value => this._filterS(value))
  );

我提交时会得到下拉菜单和功能,但是每次我键入字符或退格键时搜索都不会起作用,并且焦点会消失!

0 个答案:

没有答案