使用 Angular 8 中的 http.get() 调用在 iframe 中显示报告

Question

我正在尝试使用 http.get() 调用加载报告，并使用 angular 8 在 iframe 中显示它。

这是 API 响应。

组件.ts

    export class LogsComponent implements OnInit {
  logsData;
  logs;

  displayString

  constructor( private httpService: HttpService, private loaderService: LoaderService,
    private domSanitizer: DomSanitizer) { }

  ngOnInit() {
    this.httpService.getLogs().subscribe(data => {
      this.logsData = data;
      this.displayString = this.domSanitizer.bypassSecurityTrustHtml(this.logsData);
    })

  }

}

组件.html

<iframe [srcdoc]="displayString"></iframe>

得到这个错误。

Answer 1

看起来您的 HttpService 正在从 API 获取一个无法反序列化为 JSON 对象的字符串。 您可以将字符串响应返回到具有存储该字符串的属性的对象中。 在组件上，您可以解开该 JSON 对象并将其传递给组件。 ** 需要注意的一件重要事情是 Angular 会将字符串视为不安全，您需要通过调用 DomSanitizert.bypassSecurityTrustHtml 来清理字符串并将字符串传递给该方法。 希望这可以帮助。