In my last article we discuss on how to share data using Input & Output with event emitter.
Child to Parent Data Sharing via ViewChild
ViewChild decorator allows a one component injected in another component, it gives first(Parent) component access to its functions and class. Child component available after view initialized so we need ”
AfterViewInit” Life cycle hook for get data from child component.
Here is the sample example for passing data from child to parent using ViewChild decorator.
Parent Component Code
Child Component Code
Using @ViewChild to inject a reference to a DOM element
We can access native DOM elements using template reference variable. For example In our template with the Default Input value reference variable:
<input #nameInput placeholder="Enter Your Name">
In above example “nameInput” is template reference we can assign value using ViewChild.
Full Embedded code For above codes.
Spread the love
25