父组件中获取子组件的方法

Parent.html

<app-child #child></app-child>
<button (click)="child.callMethod()">Call</button>

Old answer

You can use @ViewChild by Parent like in example:

Parent

import { Component, ViewChild } from '@angular/core';
import { ChildComponent } from './child.component';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  constructor() { }
  @ViewChild(ChildComponent) private myChild: ChildComponent;
  submit() {
    this.myChild.callMethod();
  }
}

Child:

import { Component } from '@angular/core';

@Component({
  selector: 'child',
  template: `<h3>Child component {{test}}</h3>`
})
export class ChildComponent {
  test = 0;
  callMethod() {
    console.log('successfully executed.');
    this.test++;
  }
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容