FE/Angular

[ ANGULAR ] innerHTML CSS - encapsulation

HEON.D 2022. 12. 7. 03:43

https://stackoverflow.com/questions/44210786/style-not-working-for-innerhtml-in-angular

 

Style not working for innerHTML in Angular

I am passing html as innerHtml to my view. Below is my view <div [innerHTML]="someHtmlCode"></div> if I pass the below code, it is working fine. this.someHtmlCode = "<...

stackoverflow.com

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

@Component({
  selector: 'example',
  styles: ['.demo {background-color: blue}'],
  template: '<div [innerHTML]="someHtmlCode"></div>',
  encapsulation: ViewEncapsulation.None,
})
export class Example {
  private someHtmlCode = '';

  constructor() {
    this.someHtmlCode = '<div class="demo"><b>This is my HTML.</b></div>';
  }
}