6.在父组件中使用子组件的数据

ViewChild可以在父组件中使用子组件的数据或者方法

1.给子组件一个名称

//1.新建一个content组件
//2.在父组件中使用content组件
<app-content #content></app-content>

export class ContentComponent implements OnInit {
  public msg:string="我是你孩儿"
  ...
}

export class ContentComponent implements OnInit {
  public msg:string="我是你孩儿"
  ...
  run(){
    console.log("hello world")
  }
}

2.在父组件中导入ViewChild模块

import { Component,ViewChild } from '@angular/core';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
@ViewChild('content',{static:false}) content:any;
constructor(){
 console.log(1)
}
}

//父组件中使用数据
<p>{{content.run()}}</p>