码迷,mamicode.com
首页 > 其他好文 > 详细

angular 父组件调用子组件

时间:2018-04-25 11:29:42      阅读:419      评论:0      收藏:0      [点我收藏+]

标签:component   disable   url   from   void   rom   string   lin   button   

import { Component, OnInit, ViewChild } from @angular/core;

@Component({
  selector: app-child,
  templateUrl: ./child.component.html,
  styleUrls: [./child.component.css]
})
export class ChildComponent implements OnInit {



  constructor() { }

  ngOnInit() {
  }
  greeting(str: string) {
    console.log(str);
  }

}
<p>
  child works!
</p>
<app-child #child1></app-child>
<app-child #child2></app-child>
<button (click)="child2.greeting(‘child2的问候‘)">点我</button>
import { Component, ViewChild } from @angular/core;
import { ChildComponent } from ./child/child.component;

@Component({
  selector: app-root,
  templateUrl: ./app.component.html,
  styleUrls: [./app.component.css]
})
export class AppComponent {

  @ViewChild(child1)
  child1: ChildComponent;

  constructor() {

  }
  // tslint:disable-next-line:use-life-cycle-interface
  ngOnInit(): void {
    this.child1.greeting(child1的问候);
  }
}

 

angular 父组件调用子组件

标签:component   disable   url   from   void   rom   string   lin   button   

原文地址:https://www.cnblogs.com/chenyishi/p/8941123.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!