отфильтруйте совпадение, набрав буквы в angular 6

Question

var item= [
        {
           id :2,
           name : "apple",


        },
{
           id :3,
           name : "box",


        }
     ]

Я хочу отфильтровать указанный выше массив в angular 6. Когда я начинаю писать букву «a», я хочу, чтобы яблоко отображалось в пользовательском интерфейсе в качестве опции для выбора, а когда я выбираю приложение, я хочу отправьте свой идентификатор на сервер.

Я пробовал эти методы

 this.filteredOptions = this.myControl.valueChanges
      .pipe(
        startWith(''),
        map(val => val.length >= 1 ? this.filter(val): [])
      );
   filter(val: string): string[] {

    return this.items.filter(option =>
      option.toLowerCase().indexOf(val.toLowerCase()) === 0);;
  }

, но это работает только для этого типа массива (this.options = ['apple', 'box', ];)

 <input class=" adj1"  type="text"  matInput  [formControl]="myControl"   id="name" name="name" formControlName="name" [matAutocomplete]="auto">
          <mat-autocomplete #auto="matAutocomplete"  >
            <mat-option  *ngFor="let option of filteredOptions | async" [value]="option">
              {{ option }}
            </mat-option>
          </mat-autocomplete>

может кто подскажет как это сделать? ...