Переключение между двумя подписками в методе ngOnInit () - PullRequest
Новая
       20

Переключение между двумя подписками в методе ngOnInit ()

0 голосов
/ 03 июля 2019

У меня есть страница, где я заполняю счета в сетке. В сетке есть возможность просмотра платежей по конкретному счету. Кнопка переключает пользователя со страницы счетов на страницу платежей, где она затем фильтрует все платежи, так что отображается только тот платеж, который соответствует этому конкретному счету. Кроме того, при нажатии на саму страницу платежей он заполняет все платежи в сетку. Я выполнил обе эти функции в методе ngOnInit (), однако мне нужно иметь возможность переключаться между ними. Другими словами, я хочу фильтровать платежи, когда пользователь нажимает кнопку на странице счетов и когда пользователь нажимает на вкладку платежей в навигационной панели, я хочу, чтобы он отображал все платежи. Итак, я протестировал обе подписки и знаю, что они работают, но как я могу переключиться между двумя подписками, чтобы добиться этого? Любая помощь приветствуется.

Я поиграл с различными переменными и проверками на равенство в операторе if и даже попытался изменить расположение строки в операторе if, но без преобладания 

ngOnInit() {
  this.sub = this.route.params.subscribe(
    params => {
      if (params == null) { //HERE LIES THE ISSUE
         this.invoiceNum = params['invoiceNum'];

         //displays FILTERED payments
        this.paymentService.showPayments(this.invoiceNum).subscribe(
        res => {
          this.payments = res.value;
          this.loading = false;
          console.log(res);
        },  
        err => {
          if (err.status == 401) {
            this.auth.logOut();
          }
          this.loading = false;
          console.log(err);
        }
      );
    } else {

      //displays ALL payments
      this.paymentService.getPayments().subscribe(
        res => {
          this.payments = res.value;
          this.loading = false;
          console.log(res);
        },
        err => {
          if (err.status == 401) {
            this.auth.logOut();
          }
          this.loading = false;
          console.log(err);
        }
      );
    }
   }
 );
}

1 Ответ

0 голосов
/ 03 июля 2019

Вы можете использовать switchMap.switchMap может вернуть разные предметы для условия.

Это решение переключает Route Parameter Changes в зависимости от HTTP Request for payments субъекта.Если в параметрах маршрутизатора указано invoiceNum, он вернет предмет особых платежей за invoiceNum.Или он вернет тему всех платежей.

Вы можете повторно использовать обратный вызов onNext / onError для обоих случаев. 

ngOnInit() {
  this.sub = this.route.params
  .pipe(
    switchMap(params => {
      if (params['invoiceNum'] !== undefined) {
        //displays FILTERED payments
        return this.paymentService.showPayments(this.invoiceNum);
      } else {
        //displays ALL payments
        this.paymentService.getPayments();
      }
    })
  )
  // Reuse onNext/onError callbacks
  .subscribe(
    res => {
      this.payments = res.value;
      this.loading = false;
      console.log(res);
    },  
    err => {
      if (err.status == 401) {
        this.auth.logOut();
      }
      this.loading = false;
      console.log(err);
    }
  );
}
...