Используйте параметры углового маршрута без подписки на него

Question

Я пишу простое приложение с пользовательским интерфейсом, и мне нужно вызвать API, чтобы получить продукт по идентификатору в компоненте сведений о продукте.Я получаю из параметров маршрута

Обычно я делаю что-то вроде этого:

this.activatedRoute.params
   .subscribe(params => {
     if (params['primaryKey']) {
       this.service.get(params['primaryKey'])
         .subscribe(product => {
           this.product = product;
         });
     }
   });

И это прекрасно работает, выглядит немного уродливо с этими деревьями подписки.Я хочу использовать больше RxJS, чтобы это выглядело так (консольные журналы только для демонстрации):

this.product$ = this.activatedRoute.params
  .pipe(filter(params => {
       console.log('in filter', params);
       return 'primaryKey' in params;
     }),
     map(params => {
       console.log('in map', params);
       return parseInt(params.primaryKey, 10);
     }),
     switchMap(primaryKey => {
       console.log('in switch map', primaryKey);
       return this.service.get(primaryKey);
     }));

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

Answer 1

Вы начинаете с Observable, который затем вы проходите через некоторые функции (фильтрация, отображение и т. Д.).

Однако вы не начнете наблюдать его и собирать значения, пока не вызовете subscribe().Вы можете переместить всю логику внутрь этой функции или извлечь ее в операторы RxJS, но вы все равно эту функцию в конце:

this.product$ = this.activatedRoute.params
  .pipe(...)
  .subscribe();

Более подробную информацию вы можете найти в документации по функции подписки .

Answer 2

Вам нужно подписаться в конце, если вы хотите получить значение из созданного вами потока. Это не сработает, пока вы не сделаете это. Другой способ - использовать асинхронный канал в шаблоне для продукта $.

Answer 3

Применяя различные операторы с помощью pipe, вы создаете новый Observable на основе существующего, говоря, что к полученным результатам должны применяться дополнительные функции.

Однако он не выдает значения, пока не будет создан первый Subscription.