Question

我正在尝试从我控制的远程URL加载一些HTML，然后希望将其显示在我的网站上。

我正在使用以下代码显示我的HTML：

<div [innerHTML]="headerHTML"></div>

要加载我正在使用的内容：

this.http.get('https://www.server.com/snippet.php')
.subscribe((res) => {
  this.headerHTML = res.text();
});

但这会将我的响应中的HTML转换为文本并删除HTML标签。

如果我尝试不使用.text()，那么我将得到一个Response对象，并且不知道如何访问包含HTML的_body元素。

this.http.get('https://www.server.com/snippet.php')
.subscribe((res) => {
  this.headerHTML = res;
});

Answer 1

那呢：

this.http.get('https://www.server.com/snippet.php')
.subscribe((res) => {
  let str = JSON.stringify(res);
  let resJson = JSON.parse(str);
  this.headerHTML = resJson._body;
});

这样，您可以毫无问题地访问响应_body。

Answer 2

这似乎行得通，所以我会贴出来，以防他人。

import { DomSanitizer } from '@angular/platform-browser';

然后将其添加到我的构造函数中：

private sanitizer: DomSanitizer

然后我使用以下命令访问HTML响应：

this.headerHTML = this.htmlTransform((<any>res)._body);

我的htmlTransform函数是：

htmlTransform(content) {
  return this.sanitizer.bypassSecurityTrustHtml(content);
}

使用以下方法成功地使我能够看到模板中的HTML：

<div [innerHTML]="headerHTML"></div>

使用this.http.get

2 个答案: