Угловая замена компонента

В одном случае данные отправляются из двух разных компонентов; скажем OneComponent а также TwoComponent и есть ResultComponent которые получают эти данные через Input() декоратор. Также в ResultComponent данные объединяются с использованием OnChanges интерфейс:

  ngOnChanges(changes: SimpleChanges) {
    if (changes['dataFromCompTwo']) {
      this.dataFromComp = this.dataFromCompTwo;
    }
  }

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

STACKBLITZ => Я хотел бы показать Вот результат только один раз.

Источник

2 ответа

Решение

Это межкомпонентное общение. Вы должны использовать один из методов, описанных на этой странице документации Angular.

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

Источник

Если у вас есть два компонента, отправляющих изменения, вы можете получить к ним доступ, используя:

  • changes.componentOne
  • changes.componentTwo

SimpleChanges имеет другое свойство под названием firstChange который вы можете использовать, чтобы проверить, является ли это первое изменение, поступившее от этого конкретного компонента, как это:

  • changes.componentOne.firstchange - это будет означать, что это первое изменение, отправленное компонентами
Источник
Другие вопросы по тегам