Question

我正在开发一个Angular 2应用程序，它在我的应用程序中显示新闻项目。新闻项目保存在数据库中，并使用Angular的[innerHTML]绑定加载到模板中。

当新闻项目内容中存在嵌入内容（如推文）时会出现问题，这需要加载javascript文件（例如//platform.twitter.com/widgets.js）。问题是即使解析了页面，浏览器也不会下载文件。

有谁知道如何解决这个问题？谢谢！

Answer 1

我想如果你有这样的东西，它会下载文件。因此，当您获得新闻Feed项目时，如果您有新闻源项目的任何数据，当您可以确定它是否嵌入了Twitter时，您可以检查它，然后获取您需要的任何js文件。

loadedURLs = {
// to hold a cache so you wont download more than once.
};

this.service.fetchDataFromDB()
.subscribe(data =>{
   if(data.url.indexOf('twitter') != -1 && loadedURLs[data.url] == undefined){
     loadedURLs[fileURL] = fileURL;
     // send the file name you want or need.
     this.downloadJS(JSFileURL);
   }
});
downloadJS(fileURL){
   var script = document.createElement('script');
   script.src = (fileURL);
   document.head.appendChild(script);
}

Answer 2

对于有兴趣从包含HTML的字符串中获取所有外部脚本的人：

findExternalScriptsInHtmlString(string) {
    var parser = new DOMParser();
    var scripts = parser.parseFromString(string, 'text/html').getElementsByTagName('script');
    var result = [];

    for (var i = 0; i < scripts.length; i++) {
        var src = scripts[i].getAttribute('src');
        if (src.length && result.indexOf(src) === -1) result.push(src);
    }

    return result;
}

在Angular 2 innerHTML绑定中下载脚本

2 个答案: