美文网首页angular2与vue的那些事
ng2父组件中触发子组件中的方法@ViewsChild()

ng2父组件中触发子组件中的方法@ViewsChild()

作者: 阿踏 | 来源:发表于2018-04-05 15:29 被阅读1次

1、子组件内容

import {Component} from "@angular/core";
@Component({
  selector: "my-contact",
  templateUrl: "<a (click)='childClick()'>单机事件</a>"
})
export class ChildComponent {
  constructor() {
    console.log("contact");
  }

  childClick() {
    alert("子组件的事件触发");
  }
}

2、父组件

import {Component, ViewChild} from "@angular/core";
import {ChildComponent} from "./child.component";
@Component({
  selector: "my-home",
  templateUrl: "<a (click)='parentClick()'>单机,调用子组件的方法</a>"
})
export class ParentComponent {
  @ViewChild(ChildComponent) child: ChildComponent;
    parentClick() {
        this.child.childClick();
    }
}

相关文章

网友评论

    本文标题:ng2父组件中触发子组件中的方法@ViewsChild()

    本文链接:https://www.haomeiwen.com/subject/ghapfftx.html