Блог

Главная - Вопросы по программированию - отсутствует что-то фундаментальное в observable

отсутствует что-то фундаментальное в observable

#angular #rxjs

#angular #rxjs

Вопрос:

Я пытаюсь использовать observable для передачи массива строк из одного компонента в другой. Я могу создать observable в одном компоненте и присоединить к нему из другого, но я совершенно не понимаю, как я изменяю значение observable, чтобы 2-й компонент мог воспринять изменения. Я создаю массив строк через диалоговое окно, и это работает нормально. Каждый раз, когда я закрываю диалоговое окно, у меня появляется новый массив строк, но я не смог выяснить, как обновить observable array, чтобы новые значения передавались компоненту subscriber. Здесь я объявляю наблюдаемое:

   public getIMEIs(): any {
     console.log('GetIMEIs');
     const IMEIsObservable = new Observable( observer => {
       console.log('returning devices: ', this.devicesToTrack);
       observer.next(this.devicesToTrack);
     });
     return IMEIsObservable;
   }

И вот где я подписываюсь на это во 2-м компоненте:

     const devicesToTrackObservable = this.devicesToTrackService.getIMEIs();
    devicesToTrackObservable.subscribe((devices: string[]) => {
      this.devicesToTrack = devices;
      console.log('devices to track: ', devices);
    })

И здесь обрабатывается выход из диалогового окна:

       dialogRef.afterClosed().subscribe(result => {
        console.log('after dialog, returnData:', result);
        this.devicesToTrack = result[0];
        console.log('IMEIs to track:',this.devicesToTrack);
      });

Когда у меня есть новый массив строк для отправки во 2-й компонент, как мне установить новое значение наблюдаемого? Я пытался создать функцию set, но ничто из того, что я пробовал, не проходит мимо компилятора в том, что касается ссылки на observable. Это что-то простое или мне нужно переосмыслить то, как я все делаю?

Спасибо…..

Комментарии:

1. Избегайте создания нового observable каждый раз в вашем getIMEIs() методе и просто помещайте новые значения в одну и ту же ссылку observable в обработчике закрытия диалоговых окон. Я предполагаю, что getIMEIs() и обработчик закрытия диалога являются частью одного и того же кода компонента.

Ответ №1:

Пример кода для выделения observable в сервис и использования его для обмена данными между двумя компонентами:

  DevicesToTrackService {
     IMEIsObservable$ = new Subject<any>();

     getIMEIs() {
         return this.IMEIsObservable$.asObservable();
     }

     publishIMEIs(data: any) {
         this.IMEIsObservable$.next(data);
     }
 }

 componentOne {
    ...

    const devicesToTrackObservable = this.devicesToTrackService.getIMEIs();
    devicesToTrackObservable.subscribe((devices: string[]) => {
      this.devicesToTrack = devices;
      console.log('devices to track: ', devices);
    })
 }

 componentTwo {
     ...

     dialogRef.afterClosed().subscribe(result => {
        console.log('after dialog, returnData:', result);
        this.devicesToTrack = result[0];
        this.devicesToTrackService.publishIMEIs(this.devicesToTrack)
        console.log('IMEIs to track:',this.devicesToTrack);
      });
 }