Служба наблюдаемого хранилища Angular2 с вопросами о массиве/объекте — связь между компонентами

Первый вопрос, так что полегче со мной!

Я хочу создать общий сервис в Angular2, который предоставляет наблюдаемое свойство, на которое могут подписаться компоненты в приложении.

Также я хочу настроить это так, чтобы данные предоставлялись из компонента, а не через HTTP-вызов. Я нашел примеры настроек, в которых БД используется в качестве источника данных для действий CRUD, но не там, где это массив или объект, созданный в компоненте.

Краткий пример выглядит следующим образом:

  1. Сервис создает наблюдаемое свойство при загрузке
  2. Comp1 обновляет свойство службы.
  3. Comp2 (подписанный на наблюдаемое свойство в службе) получает обновление от службы.
  4. Comp2 продолжает получать изменения, поскольку Comp1 продолжает вносить изменения в наблюдаемое свойство.

Кто-нибудь знает хорошее объяснение или пример этого варианта использования?

Спасибо!


person BangsKeyboards    schedule 12.01.2017    source источник


Ответы (1)


Это довольно распространенный вариант использования, вы можете сделать это следующим образом.

1) В вашем сервисном конструкторе инициализируйте наблюдаемый

this.myObservable = new Subject();

В зависимости от того, чего вы хотите достичь, вы можете использовать разные наблюдаемые. Subject является как Observable, так и Observer и будет возвращать свое последнее значение при подписке.

2) В вашем исходном компоненте нажмите новое значение

myService.myObservable.next({...});

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

3) В ваших потребительских классах подпишитесь на поток

myService.myObservable.subscribe(value => ...);

Вы можете подписаться на него в любом количестве компонентов. Когда вы подписываетесь, вы сразу же получаете последнее значение, а затем новые значения при обновлении.

Если вы хотите иметь начальное значение, при инициализации Observable в сервисе вы можете использовать BehaviorSubject вместо Subject.

person Mateusz Woźniak    schedule 12.01.2017
comment
Благодарю вас! Я танцевал вокруг правильного синтаксиса. Ваше описание идеально помогло мне понять, как я изучаю Rx.js. - person BangsKeyboards; 12.01.2017