CodeKhel

Parent component to child component interaction Child1 Component child1.component.ts => import  {  Component ,  OnInit ,  Output ,   EventEmitter  }  from   '@angular/core' ; @ Component ({   selector:  'app-child1' ,   templateUrl:  './child1.component.html' ,   styleUrls: [ './child1.component.css' ] }) export   class   Child1Component   implements  OnInit {   @ Output ()  public  childUsername  =   new   EventEmitter ();    fireEvent (){      this . childUsername . emit ( 'Hey! This is the Child component' );   }    constructor () { }    ngOnInit () {   } } child1.component.html => < div   class = "text-danger bg-success text-right mt-2 mb-2" ...

Parent component to child component interaction Parent Component parent.component.ts => import  {  Component ,  OnInit  }  from   '@angular/core' ; @ Component ({   selector:  'app-parent' ,   templateUrl:  './parent.component.html' ,   styleUrls: [ './parent.component.css' ] }) export   class   ParentComponent   implements  OnInit {  username :any   =   'this is the parent child' ;    constructor () { }    ngOnInit () {   } } parent.component.html => < div   class = "text-center  bg-primary text-white p-1 m-2" >    < H3 > PARENT TO CHILD COMPONENT COMMUNICATION  </ H3 >    < app-child   [uname] = 'username' >   </ app-child > </ div > ...

Custom Age Pipe with source code implemetation==>   Create age pipe in pipes fder by following command in command terminal ng g p pipes/age age.component.ts => DateOfBirth =   new   Date ( '01/07/1990'  ); age.pipe.ts => import  {  Pipe ,  PipeTransform  }  from   '@angular/core' ; @ Pipe ({   name:  'age' }) export   class   AgePipe   implements  PipeTransform {    transform (value :   any ) :   any  {      console . log ( "print age pipe = "   +   value );      let   currentDate :any   =   new   Date (). getFullYear ();  // 2019      let   birthYear :any   =   new   Date ( value ). getFullYear ();      let   ageofMan :any   =    currentDate   - ...