Как заставить компонент слушать и ждать данные от другого компонента без события в Angular 5?

Question

У меня проблема с работой с двумя компонентами (всплывающими окнами), в которых мне приходится отправлять данные из компонента chlid другому (родительскому), у которого нет события для извлечения этих данных. по логике вещей мне нужно найти что-то вроде функции, которая заставляет родителя слушать изменения, сделанные в потомке. Изменения должны появляться одновременно в обоих компонентах. Может ли кто-нибудь помочь?

Answer 1

Ответ на ваш вопрос.Вам необходимо свойство Output, которое является угловым обобщением события JS.

В вашем дочернем компоненте:

class ChildComponent {
  @Input() someProperty: string;
  @Output() dataChanged = new EventEmitter<string>();

  whenSomethingHappensInChild() {
    this.dataChanged.emit('something');
  }
}

В родительском шаблоне:

...
<app-child [someProperty]="'someValue'" (dataChanged)="doSomething($event)"></app-child>
...

И в вас Родительский код:

class ParentComponent {
  ...
  doSomething(theValue: string) {
    // TA-DAA! you have the value.
  }
  ...
}

Пожалуйста, сделайте себе одолжение и ПРОЧИТАЙТЕ ДОКУМЕНТЫ, или, лучше, книгу;)

В частности: https://angular.io/guide/architecture-components имеетполный обзор основ связывания, в которые входит эта проблема.

Хорошего дня.

Answer 2

Проблема решена: я использовал тег @Host (), чтобы получить текущий экземпляр родительского компонента и получить доступ к методу, который изменяет его атрибуты.

Вот что вы должны сделать.

Во-первых: Вы должны отклонить свой родительский компонент в дочернем элементе

parent:ParentComponent;

Второй: вы должны передать ваш текущий родительский экземпляр новому объявлению в конструкторе

constructor(@Host() currentParent:ParentComponent){
this.parent=currentParent
 }

Третье: Теперь попробуйте просто получить доступ к методам и атрибутам в родительских компонентах

changeParentAttribute(){
    this.parent.iAmInTheParent();
    } 

Надеюсь, вы найдете это полезным

Answer 3

Да, вы можете использовать общий BehaviorSubject для передачи значений, и оба компонента должны подписаться, чтобы получить эти изменения