Angular 2将事件传递给第二级子组件

Question

在我的角度2 ngrx应用程序中,我有嵌套元素的结构:

parentContainer.ts
@Component({
  template: `<parent-component
    (onEvent)="onEvent($event)"
  ></parent-component>`,
})

class ParentContainer {
  constructor(private store: Store<IState>) { }

  private onEvent = (payload: IEventPayload) {
    this.store.dispatch(new EventAction(payload));
  }
}

parentComponent.ts
@Component({
  selector: 'parent-component',
  templateUrl: 'patent.html',
})

class ParentComponent {
  @Output() private onEvent = new EventEmitter<IEventPayload>();
}

patent.html
<div>
  ...some content

  <child-component></child-component>
</div>

在这种情况下,我可以从父组件发出事件,我需要从子组件中执行它.有没有办法将事件通过父组件传递给子组件,然后使用这样的东西:this.onEvent.emit({... some payload})？

Answer 1

在您的patent.html中,您可以让子组件直接通过onEvent发出,如下所示:

<child-component (onChildEvent)="onEvent.emit($event)">
</child-component>