Passing data to ViewChild from component - Angular

Question

How can I pass a data from component to view child element. e.g This the variable that I have declared on component:

@ViewChild('warningNotification', { static: false }) warningNotification: jqxNotificationComponent;
public test: string = "NIshan";

Now I have a element on html page

<jqxNotification #warningNotification
             [template]="'warning'"
             [blink]="false"
             [autoOpen]="false"
             [autoClose]="true"
             [closeOnClick]="true"
             [position]="'top-right'"
             [opacity]="0.9"
             [width]="'auto'">
<div><span>
        {{test}}
</span>
</div>
</jqxNotification>

but {{test}} this section not rendering any text. How can I solve this

@Exomus - I don't have @Input instead I have @VIewChild please have a look at my updated question thank you — Chris Hadfield
– Chris Hadfield, Commented Nov 6, 2019 at 15:17
I think you should close the tag <jqxNotification></jqxNotification> — Lia
– Lia, Commented Nov 6, 2019 at 15:25

Eliseo · Accepted Answer · 2019-11-06 15:38:44Z

1

In

ngAfterViewInit(){
  this.warningNotification=this.test
}

NOTE: is possible you need enclosed in a setTimeout to avoid error "change after checked"

ngAfterViewInit(){
   setTimeout(()=>{
      this.warningNotification=this.test
   })
}

answered Nov 6, 2019 at 15:38

Eliseo

58.9k4 gold badges39 silver badges82 bronze badges

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

Collectives™ on Stack Overflow

Passing data to ViewChild from component - Angular

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