在 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);
    })

  }

}

component.html

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

收到此错误。

Answer 1

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