Прослушивание модели, измененной несвязанным компонентом - Angular 7 - PullRequest
Новая
       26

Прослушивание модели, измененной несвязанным компонентом - Angular 7

0 голосов
/ 10 марта 2019

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

Моя структура: Приложение> (Служба макета / данных)> (Компонент A / Компонент B)

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

Компонент B также подписан на ту же службу данных и отображает результат на основе дальнейших расчетов значений моделей.Проблема заключается в том, что при изменении входного значения дочерних компонентов компонента A значения компонента B обновляются, но я не могу вызвать функцию UpdataCalculations (), когда они есть.Чтобы решить эту проблему, я добавил ngDoCheck () и поместил туда свою функцию, но мне это кажется действительно грубым.Что я действительно хотел бы сделать, это добавить слушатель onChange к модели на уровне компонента B.

Итак, я предполагаю, что мой вопрос А: Возможно ли это даже с Angular?и B: Есть ли лучший способ сделать это?

Служба: 

export class JobDataService {
  private jobData = new BehaviorSubject(new Job_Info_View_Model);
  currentJob$ = this.jobData.asObservable();
  constructor() {}
}

Компонент B: 

  constructor(
    private jobData: JobDataService,
  ) {}

  ngOnInit() {
    this.jobData.currentJob$.subscribe( (observing: Job_Info_View_Model) => { this.currentJob = observing; } );
  }

  ngDoCheck() {
    this.UpdataCalculations();
  }

Спасибо за любую помощь

РЕДАКТИРОВАТЬ: на самом деле не имеет смысла для компонентов A и B, чтобы быть одним компонентом, поэтому я хотел бы избежать этого, если я могу.

1 Ответ

0 голосов
/ 10 марта 2019
Хук

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

this.jobData.currentJob$.subscribe( (observing: Job_Info_View_Model) => { 
  this.currentJob = observing;
  this.UpdataCalculations();
} );
...