Как применить компоненты CSS к динамически введению HTML из API? ⇐ CSS

[Anonymous]

Я получаю строку HTML от ответа API и должен представить ее внутри моего углового компонента, сохраняя применение стилей CSS компонента.

• Использование [innerhtml] < /code>, но стили, определенные в SCS моего компонента. Применяется: < /p>

  Код: Выделить всё

  < /code>
  .content h3 {
  color: red; // This does NOT apply
  }
  

• Использование Domsanitizer для обхода ограничений безопасности:

  Код: Выделить всё

  import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
  
  htmlContent: SafeHtml;
  
  constructor(private sanitizer: DomSanitizer) {}
  
  ngOnInit() {
  this.htmlContent = this.sanitizer.bypassSecurityTrustHtml(apiResponseHtml);
  }
  < /code>
  Но стили из компонента все еще не применяются. .content h3 {color: красный; } 

  , но я хочу избежать :: ng-deep , поскольку это устарело. в моем компоненте, но это делает стили глобальным, чего я не хочу.

Как Могу ли я отображать Предоставленный API HTML внутри моего компонента при сохранении применения CSS компонента?

Подробнее здесь: https://stackoverflow.com/questions/794 ... rom-an-api