Rx js Наблюдаемая проблема - PullRequest
Новая
       7

Rx js Наблюдаемая проблема

0 голосов
/ 27 февраля 2020

Я объявил субъект в обслуживании и попытался получить sh ответ, полученный при выполнении вызова GET для внутреннего интерфейса с использованием "subject.next ()" .. также назначил наблюдаемое для субъекта с помощью "subject.asObservable () "и подписался на наблюдаемое в двух разных компонентах (родительский и маршрутизатор, дочерний объект). Проблема заключается в том, что наблюдаемое излучает новое значение только для одного подписчика, а не для двух подписчиков.

Сервис 

  subject = new Subject<any>();
  observable = this.subject.asObservable();


 public getDetails(id) {
    return this.http.get(this.url.concat(id))
      .pipe(map(data => this.extractDetails(data),
            catchError(err => this.handleError(err)));
  }
 public extractDetails(data){
    this.subject.next(data);
    return data;
  }

родительский компонент 

ngOnInIt(){
 this.hitUrl();

}
getDetails(){
    this.service.observable.subscribe(
      (data: any) => {
        console.log(data);
      },
      err => {
        console.error(err);
      }
    )
  }

  hitUrl(id: string) {
    this.service.getDetails(id).subscribe(
      (data: any) => 
        if(!!data){
            console.log(data);
            this.getDetails();
          }
      },
      err => {
        console.log(err);
      }
    );
  }

дочерний компонент маршрутизатора-выхода 

ngOnInIt(){
 this.hitUrl();

}
getDetails(){
    this.service.observable.subscribe(
      (data: any) => {
        console.log(data);
      },
      err => {
        console.error(err);
      }
    )
  }

  hitUrl(id: string) {
    this.service.getDetails(id).subscribe(
      (data: any) => 
        if(!!data){
            console.log(data);
            this.getDetails();
          }
      },ngOnInIt(){
 this.hitUrl();

}
getDetails(){
    this.service.observable.subscribe(
      (data: any) => {
        console.log(data);
      },
      err => {
        console.error(err);
      }
    )
  }

  hitUrl(id: string) {
    this.service.getDetails(id).subscribe(
      (data: any) => 
        if(!!data){
            console.log(data);
            this.getDetails();
          }
      },
      err => {
        console.log(err);
      }
    );
  }

      err => {
        console.log(err);
      }
    );
  }

В компонентах hitUrl () также срабатывает, когда выполняется призыв к действию, тогда мне нужно, чтобы наблюдаемое передавало последние данные обоим подписчикам (если призыв к действию выполняется из родительского или дочернего выхода маршрутизатора) ).

1 Ответ

0 голосов
/ 27 февраля 2020

что я понял из вашего вопроса, так это то, что у вас есть два компонента и сервис, вы получаете данные с помощью сервиса и хотите отправить данные обоим компонентам одновременно, когда бы ни вызывалась следующая функция 'getDetails ()' независимо от того, где эта функция вызывается. это может быть родительский вызов функции или потомка. 

 public getDetails(id) {
     return this.http.get(this.url.concat(id))
       .pipe(map(data => this.extractDetails(data),
             catchError(err => this.handleError(err)));   }

В вашем коде проблема в коде компонентов, который вы вызываете функцией getDetails, и внутри этой функции вы подписываете наблюдаемое, вместо этого вы должны быть подписка наблюдаемого в ngOnInit. так что когда бы этот observable.next вызывался из службы, наблюдаемая будет выполняться в обоих компонентах, потому что она будет подписана там, см. код ниже. 

 ngOnInit(){
     this.getDetails();
     this.hitUrl();   }

 getDetails(){
   this.service.observable.subscribe(
     (data: any) => {
       console.log(data);
     },
     err => {
       console.error(err);
     }
   )   
 }

 hitUrl(id: string) {
   this.service.getDetails(id).subscribe(
     (data: any) => 
       if(!!data){
           console.log(data);
         }
     },
     err => {
       console.log(err);
     }
     );   
 }

В приведенном выше коде мы сначала подписываемся на тему и тогда мы вызываем данные. внутри функции getDetails (id) в сервисе мы уже излучаем тему и также заменяем следующую строку в сервисе. 

subject = new Subject<any>();
  observable = this.subject.asObservable();

следующей 

subject = new BehaviorSubject({});

надеюсь, это поможет .. .

...