How to re initialize sub component in angular2?

user_2711623 0
Viewed 44370

I have a component inside another component, added by tag. At some point, i would like to reinitialize this sub-component, like the first it was invoke. Is there any way to do that?

angular
7 Answers

You can re initialize component using *ngIf.

<mychild *ngIf="flag"></mychild>

You can re initialize by making the flag false and true.

user_85738880

usually the best practice, in this case, is to create Behovire Subject and pass it to the component as @input()

then you can fire any action by calling behoviresubjects.next('hi')

ex:

in your parent component 

import { BehaviorSubject } from 'rxjs';

brodCastChnage: BehaviorSubject<any> = new BehaviorSubject(null);

and when you need to notify the child component about something :

this.brodCastChnage.next('something');

in HTML of the parent as well

<my-child [onChange]="brodCastChnage"></my-child>

in child component 

      @Input() onChange;

      ngOnInit() {
        this.onChange.subscribe(res=>{
        console.log('i received',res)
       });
     }
  • don't forget to unsubscribe on destroy
user_40161580

Here is a good example, how to call child component from parent component:

I call child component's function in to my parent component like this:

<cp-file-manager [(ngModel)]="container" name="fileManager"[disableFiles]="true" [disableDocId]="id" [newFolderId]="newFolderId"></cp-file-manager>

Here you can see how to call child component function from parent component ts file:

import { Component, OnInit, ViewChild  } from '@angular/core';
import { FileManagerComponent } from '../../../../shared/components/file-manager/file-manager.component'

@ViewChild(FileManagerComponent) fileManager: FileManagerComponent;

doSomething() { //this is parent component function
            this.fileManager.openFolder(); //openFolder-is child component function
    }

additional info: http://learnangular2.com/viewChild/

user_19343880
Related