Question

我在Angular 4中遇到了脚本问题。让我解释一下：我正在构建一个Angular应用程序，它将包含在更大的Web应用程序中。所以我的应用程序只是这个更大的Web应用程序中的其他应用程序之一在我的应用程序中，我需要包含一些代表此Web应用程序常见区域的HTML代码。它们将是应用程序的头部，标题，菜单和页脚。我的应用程序将被放置在剩余的空间中。因此，我检索这些HTML代码，通过绕过清理将它们转换为 SafeValue ，并使用某些 divs 的innerHTML属性包含它们。之后，我可以看到使用样式和所有内容呈现的这些HTML。

所以这就是背景。问题是这些HTML中的脚本不能运行。即使它们未被删除（您可以检查页面的HTML并查看其中的脚本），它们也不会运行。我需要它们运行，因为它们需要执行一些重要的任务，例如用链接填充菜单，动画菜单扩展，上帝知道还有什么。

我已经尝试使用文档DOM对象将这些HTML包含在 index.html 中以替换 div 我已放入索引.html 作为占位符，但我遇到了同样的问题：它呈现，但脚本不会运行。有趣的是，如果我将直接在 index.html 中运行的脚本标记（硬编码，而不是动态），它就能正常工作。

因此，脚本将具有以下形式：

<script type="text/javascript" src="//some_external_source"></script>

只有一句话：我无法控制我收到的这些常见HTML。我只是收到它们，并且为了Web应用程序的视觉识别而必须使用它们。

很抱歉，如果已经回答了。我现在一直在寻找答案，我仍然没有找到答案（虽然我确实找到了类似于AngularJS的东西），所以我发布了。

Answer 1

这不是角度2想要解决这些问题的方法，如果你想将你的应用程序划分为单独的部分，例如：内容，页眉，页脚，你应该看看命名的路由器插座，或者transcludion。

但是如果你想按照自己的方式做到这一点，那么就这样做：

@Component({.your metadata..})
export class SomeComponent{
constructor (private domSanitizer:DomSanitizer){
    this.domSanitizer.bypassSecurityTrustScript(yourScript);
}
}

通过HTML注入包含的Angular 2/4应用程序中运行javascript脚本

1 个答案: