How to change parent variable from child component in angular2

Question

my parent component html:

<app-calendar-component [view]="calView" [callback]="calendarOptions" ></app-calendar-component>
<app-weekdetails-component *ngIf="test"></app-weekdetails-component>

my parent component ts:

public test:boolean=false;

appCalendarComponent:

ngOnInit(){
Calling services here and using data, after this process I need to set 
my variable test to be true which is defined in parent component.
}

So I need to set variable test to be true when 1st child(appCalendarComponent) is initialized.

usuly, i use some output inside my child component to interact into the parent variable. But will your variable be used elsewhere? if so you may use some service to define those variables with maybe some obsever + subject tricks to get it automaticaly inside your parent component — Flow
– Flow, Commented Nov 20, 2017 at 15:35

k.vincent · Accepted Answer · 2018-07-05 08:09:19Z

5

You should use output way to comunicate with the parent component.

On the child:

import { Component, Output, EventEmitter } from '@angular/core';

@Output() componentInit = new EventEmitter<>();

ngOnInit(){
Calling services here and using data, after this process I need to set 
my variable test to be true which is defined in parent component.

//After init
 this.componentInit.emit();
}

On the parent:

HTML:

<app-calendar-component 
                  (componentInit)="componentInitialize()" 
                  [view]="calView" 
                  [callback]="calendarOptions">
</app-calendar-component>

TypeScript:

componentInitialize():void{
 this.test = true;
}

edited Jul 5, 2018 at 8:09

k.vincent

4,2438 gold badges46 silver badges87 bronze badges

answered Nov 20, 2017 at 15:34

Daniel Segura Pérez

1,1278 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to change parent variable from child component in angular2

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related