css - 如何在 Angular 中的父组件的 iframe 内容中应用字体

Question

我在演示组件中有 iframe。

<iframe
  id='contentIframe'
  class="iframeContent"
  [src]='templateUrl'
  (load)="onLoadIframe()"
  sandbox="allow-same-origin allow-scripts"
  frameborder="0"
  height="600px"
  style="width:100%;"
>
</iframe>

在我的父组件（演示组件）中，我能够应用自定义字体“Open sans”。我无法将相同的字体应用于父组件内的 iframe 中的内容。

我尝试了下面的代码，但没有工作。

 if (this.currentTemplate != null && this.currentTemplate != undefined) {

     const bodyElement = Array.from(templateHtml.getElementsByTagName('body'));
     const selectElements = Array.from(templateHtml.getElementsByTagName('select'));
     
     for (const element of bodyElement) {
       if(element.classList.contains("contentBody")) {
         element.style.fontFamily = "Open Sans";
        }
     }
}

标签： cssangulartypescriptiframe