Communication between components 24 (local variables)

Parent data binding component can not be used to read the sub-assembly properties or method calls subassembly. But in the parent component template, create a local variable to represent sub-assemblies, and then use this variable to read the property and method calls subassemblies subcomponents.

① when to call the parent component sub-assemblies can be specified with the name of the variable # <son #mySon> </ son>

② within parent components, obtained by the instance of the component class mySon

　　<div>

　　　　<son #mySon></son>

　　　   <P> </ p> {{mySon.count}} </ p> // If p tags parent components, sub-components need to display a variable class, such as count

　　　　<Button (click) = "handleClick (mySon)"> </ button> // if you want to operate in JS subassembly program ① (events up)

　　</div>

　　Program ②: Examples of the method of the parent sub-assembly component obtained by ViewChild

　　Preparations: <son #mySon> </ son>

　　Is introduced: import {ViewChild} from '@ angular / core';

　　Value: @ViewChild ( 'mySon') sonInstance;

　　Use: this.sonInstance *** / *** ().

 

 

 

 Program ②: by ViewChild