Как использовать данные о подписке () где-то еще?

Question

onKeyUp(event: any): void {
  this.technologiesService.getTechnologies(event.target.value)
    .subscribe(data => {
       this.myData = data;
    });
}

Вывод data:

Я хотел бы объявить data как свойство, чтобы я могиспользуйте это где-нибудь еще. Как вы видите, я пробовал это с this.myData = data и myData определено так в верхней части моего класса: myData = [];.

Вот как я пытаюсь использовать myData:

<mat-option *ngFor="let data of this.myData | async" [value]="data.technology">
  <span>{{ data.technology}}</span>
</mat-option>

Но я получаю следующие ошибки:

Ошибка ОШИБКИ: InvalidPipeArgument: '' для канала 'AsyncPipe'

ОШИБКА TypeError: Не удается прочитать свойство 'dispose'нуля

Что я делаю не так?

Answer 1

Вы должны использовать один из каналов подписки или асинхронного соединения не вместе. должно быть:

<mat-option *ngFor="let data of myData" [value]="data.technology">
  <span>{{ data.technology}}</span>
</mat-option>

при использовании подписки. и если вы не хотите использовать подписку, но асинхронно, это должно быть:

<mat-option *ngFor="let data of myData | async" [value]="data.technology">
  <span>{{ data.technology}}</span>
</mat-option>

ts:

onKeyUp(event: any): void {
  this.myData = this.technologiesService.getTechnologies(event.target.value)
}

Answer 2

this.myData не является асинхронным, поэтому нет необходимости исправлять асинхронный канал

<mat-option *ngFor="let data of myData" [value]="data.technology">
  <span>{{ data.technology}}</span>
</mat-option>

.

Однако я бы посоветовал вместо этого сделать наблюдаемый переменной экземпляра.

onKeyUp(event: any): void {
  this.myData = this.technologiesService.getTechnologies(event.target.value)
}

<mat-option *ngFor="let data of myData | async" [value]="data.technology">
  <span>{{ data.technology}}</span>
</mat-option>

Answer 3

<mat-option *ngFor="let data of myData | async" [value]="data.technology">
  <span>{{ data.technology}}</span>
</mat-option>