Angular - Внедрить пользовательский файл CSS во внешний фрейм

Question

Я пытаюсь внедрить файл CSS в сторонний iframe, который мне нужен, чтобы изменить стиль.я уже изучил уже заданные вопросы: 53295194 , 51249599 , 52859158 & 51496114 .Сейчас я использую код из последнего ответа, например:

app.component.html

<iframe #myIframe src="https://external-source.com" style="width:100%; height:100%;" scrolling="no" frameborder="0"></iframe>

app.component.ts

import { Component, HostListener, ViewChild, ElementRef, AfterViewInit } from '@angular/core';
export class AppComponent implements AfterViewInit {

  @ViewChild('myIframe') public myIframe;
  ngAfterViewInit() {
    const iframDoc = this.myIframe.nativeElement.contentWindow.document;
    console.log("myIframe:", iframDoc);
    iframDoc.head.appendChild('iframe_style.css');
  }
***

Я получаю следующую ошибку:

Ошибка ОШИБКИ: «Ошибка типа: Аргумент 1 Node.appendChild не является объектом.»

Ошибка консоли

Кроме того, я хотел бы использовать файл .sass вместо css, но я не уверен, как ссылаться на файл из приложения .component.ts .Это нормально?

iframDoc.head.appendChild('assets/css/Sections/iframe_style.css');

Мои настройки:

Угловой CLI: 7.0.7 Узел: 10.13.0 ОС: linux x64 Угловой: 7.0.4