Question

我是Angular的新手，正在尝试解决有关在Angular应用程序中显示HTML网站的问题。具有所有资源（如图像，css文件等）的网页都存储在外部服务器上。网站包含文本，图像，自己的样式，css等。当我在Web浏览器中打开此类网站时，Ethingthink可以正常工作。当我尝试在我的应用程序中显示此类页面时，很多问题都没有解决。

我使用innerHtml在应用程序中显示页面

<div [innerHtml]="content"></div>

在显示之前，所有链接都将更改为直接链接。显示文本和图像，但不应用样式。可能是因为与.css的链接位于<“ head>块中”这一事实有关？

希望某人遇到了像我这样的问题，可以为您提供帮助:) 预先感谢。

Answer 1

您可以尝试在将HTML放入HTML之前Sanitize（请阅读Angular的文档，了解使用DomSanitizer的含义）。

在您的组件中，注入DomSanitizer，并绕过安全性：

safeContent;
constructor(private sanitizer:DomSanitizer){
    const content = "your html";
    this.safeContent = this.sanitizer.bypassSecurityTrustHtml(content);
}

并在您的html中：

<div [innerHtml]="safeContent"></div>

带有Angular应用中所有CSS的HTML网页

1 个答案: