angular2调用父组件的函数

Question

我有一个应用程序，其中有一个可以上传文件的上传组件。它嵌入在 body.component 中。

在上传时，它应该使用父组件的函数(例如 BodyComponent.thefunction())(调用以更新数据):但前提是父组件是 主体.组件。上传也可能用于具有不同行为的其他地方。

类似parent(this).thefunction()，如何实现？

Answer 1

我会在子组件中创建一个自定义事件。像这样:

@Component({
  selector: 'child-comp',
  (...)
})
export class ChildComponent {
  @Output()
  uploaded = new EventEmitter<string>();

  uploadComplete() {
    this.uploaded.emit('complete');
  }

你的父组件可以注册这个事件

@Component({
  template `
    <child-comp (uploaded)="someMethod($event)"></child-comp>
  `,
  directives: [ ChildComponent ]
})
export class ParentComponent {
  (...)

  someMethod(event) {
  }
}

另一种方法是将父组件注入(inject)到子组件中，但它们将紧密链接在一起...