Adding class to dynamically created component angular

Question

i have the following code,

createComponent(message, some_css_class) {
    this.msg.reset();
    const factory = this.resolver.resolveComponentFactory(MessageComponent);
    const componentRef = this.entry.createComponent(factory);
    componentRef.instance.message = message;
    //how to add the passed css class to the this component
}

here i dynamically create the component, now need to add the passed css class to it.

Sasi Kumar M · Accepted Answer · 2019-10-11 18:29:11Z

1

In Angular 5/6, using Renderer2 from @angular/core, you can try like below,

constructor(private resolver: ComponentFactoryResolver, private renderer2: Renderer2) { }

createComponent(message, some_css_class) {
    this.msg.reset();
    const factory = this.resolver.resolveComponentFactory(MessageComponent);
    const componentRef = this.entry.createComponent(factory);
    componentRef.instance.message = message;
    this.renderer2.addClass(componentRef.location.nativeElement, some_css_class);
}

answered Oct 11, 2019 at 18:29

Sasi Kumar M

2,6501 gold badge26 silver badges26 bronze badges

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

Comments

Andrei · Accepted Answer · 2019-10-11 15:37:49Z

0

you could use componentRef.instance.cssClass = some_css_class and @HostBinding('class') public cssClass; inside of a component

answered Oct 11, 2019 at 15:37

Andrei

12.8k1 gold badge16 silver badges25 bronze badges

Collectives™ on Stack Overflow

Adding class to dynamically created component angular

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related