Как обнаружить изменение переменной в Angular2

У меня есть следующий объект конфигурации, который устанавливается до запуска конструктора:

config: Object = {
     onSlideChangeEnd : function(slide:any) {
          this.currentSlideIndex = slide.activeIndex;
     }
};

Я хочу уведомить службу об изменении, проблема в том, что служба еще недоступна, когда конфигурация установлена:

 constructor(private user: UserService,
             private layout: LayoutService) {
 }

Как я могу уведомить службу об изменении этой переменной?


person Yuvals    schedule 28.01.2017    source источник
comment
Вы хотите вызвать функцию на сервисе? Кроме того, где вы разместили первый код блока в своем компоненте?   -  person Ali Baig    schedule 29.01.2017
comment
Используйте наблюдаемую, которая уведомляет об обновлениях.   -  person Günter Zöchbauer    schedule 29.01.2017
comment
@GünterZöchbauer GünterZöchbauer все передовые методы, которые я видел, упоминали изменения в переменных Input() или HTTP-запросах. Как я могу подписаться на переменную числового типа?   -  person Yuvals    schedule 29.01.2017
comment
С помощью наблюдаемого. См. примеры angular.io/docs/ts. /последняя/поваренная книга/   -  person Günter Zöchbauer    schedule 29.01.2017
comment
Это звучит как огромные накладные расходы для подписки на одно изменение переменной ... нет ли способа сделать это так же, как наблюдаемые KnockoutJS?   -  person Yuvals    schedule 29.01.2017


Ответы (1)


Ну, как было предложено, используйте Observables, это не такая уж большая проблема, и это работает довольно хорошо. На самом деле это не более нескольких строк.

Объявите в какой-то общей службе службу, которую они совместно используют, например, службу, объявленную как провайдер в этом модуле, чтобы у вас не было двух экземпляров одной и той же службы. Добавьте Subject в этот сервис и метод для генерации значения:

public configObservable = new Subject<number>();

emitConfig(val) {
  this.configObservable.next(val);
}

А в компоненте нужно установить конфиг:

emit(val) { // your value you want to emit
  this.myService.emitConfig(val);
}

А затем подпишитесь на значение там, где вам это нужно:

constructor(private myService: MyService) {
  this.myService.configObservable.subscribe(value => {
    this.value = value;
  })
}

Работающий плункер с приведенным выше кодом во взаимодействии родитель-потомок:

Плункер

Что касается вашего комментария о @Input(), это хорошо работает при взаимодействии родительского компонента с дочерним, так что в этом случае это не сработает для вас.

person AJT82    schedule 29.01.2017
comment
Работает как шарм. Я просто хочу добавить, что это прекрасно работает и для направленной связи между компонентами. Я использовал внутри модального окна для связи с веб-приложением без сбоев. - person KeaganFouche; 11.06.2018