24组件之间的通信(本地变量)

父组件不能使用数据绑定来读取子组件的属性或调用子组件的方法。但可以在父组件模板里,新建一个本地变量来代表子组件,然后利用这个变量来读取子组件的属性和调用子组件的方法。

①在父组件去调用子组件时,可以指定 # 加上变量的名称 <son    #mySon></son>

②在父组件中,通过 mySon 得到组件类的实例

  <div>

    <son #mySon></son>

      <p></p>{{mySon.count}}</p>  //如果父组件中的p 标签,需要显示子组件类中某个变量,比如count

    <button (click)="handleClick(mySon)" ></button>  //如果想在JS中操作子组件,方案①(events up)

  </div>

  方案②:父组件通过ViewChild得到子组件的实例方法

  准备:<son  #mySon></son>

  引入:import { ViewChild } from '@angular/core';

  取值:@ViewChild (' mySon ')  sonInstance;

  使用:this.sonInstance.***/***()

 方案②:通过ViewChild

 

原文地址:https://www.cnblogs.com/shanlu0000/p/12227631.html