Angular 6 : Parent and Child component

Angular 6 : Parent and Child component

Here is sample code, how to use parent and child component in angularjs 6.

Model Class

export class country{
    ID : number;
    Name : string;
}

Parent Component

parent.component.ts

  name : string = "DemoName";
  vmCountry : country;
  
  constructor() { }

  ngOnInit() {
    this.vmCountry = new country();
    this.vmCountry.Name = "India";
  }

parent.component.html

<div>
  Some html here
</div>

<app-child [name]="name" [varCountry]="vmCountry"></app-child> 

<div>
  Some html here
</div>

another action, so we can get it as below,

 "expression": {
 "and": [
  {
  "equals": [
   "@outputs('HttpStepName')['body']?['ResultCode']",
   "OK"
  ]
  }
 ]
},

Child Component

child.component.ts

  @Input() name : string;
  @Input() varCountry:country;

  constructor() { }

  ngOnInit() {
  }

child.component.html

<p>
  child works {{name}}!  
</p>
<h1>{{varCountry.Name}}</h1>

app.module.ts

@NgModule({
  declarations: [
    ....
    ParentComponent,
    ChildComponent
  ],  
  .....  
  })

Hope this will help you and save your time.

Enjoy !!!

:)