时间戳

首页 > 解决方案 > 需要一种从父组件的点击事件中调用子组件功能的方法

angular - 需要一种从父组件的点击事件中调用子组件功能的方法

问题描述

我的父组件中有一个单击事件需要从我的子组件调用特定函数。任何帮助将不胜感激！

标签： angulartypescript

解决方案

你可以用@ViewChild 做到这一点：

带类型选择器

@Component({
  selector: 'child-cmp',
  template: '<p>child</p>'
})
class ChildCmp {
  doSomething() {}
}
@Component({
  selector: 'some-cmp',
  template: '<child-cmp></child-cmp>',
  directives: [ChildCmp]
})
class SomeCmp {
  @ViewChild(ChildCmp) child:ChildCmp;
  ngAfterViewInit() {
    // child is set
    this.child.doSomething();
  }
}

带字符串选择器

@Component({
  selector: 'child-cmp',
  template: '<p>child</p>'
})
class ChildCmp {
  doSomething() {}
}
@Component({
  selector: 'some-cmp',
  template: '<child-cmp #child></child-cmp>',
  directives: [ChildCmp]
})
class SomeCmp {
  @ViewChild('child') child:ChildCmp;
  ngAfterViewInit() {
    // child is set
    this.child.doSomething();
  }
}

您可以在这里阅读更多内容： 从父类调用子组件方法 - Angular 在这里：https ://angular.io/guide/component-interaction

推荐阅读