【问题标题】:Download scripts inside Angular 2 innerHTML binding在 Angular 2 innerHTML 绑定中下载脚本
【发布时间】:2016-09-17 18:33:49
【问题描述】:

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

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

有谁知道如何解决这个问题? 谢谢!

【问题讨论】:

  • 你是如何下载文件的?

标签: javascript angularjs angular angularjs-bindings


【解决方案1】:

我想如果你有这样的东西,它会下载文件。 因此,当您获得新闻提要项目时,如果您有任何有关新闻提要项目的数据,当您可以确定它是否嵌入了 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);
}

【讨论】:

  • 谢谢,但是如何让 Angular 调用该 downloadJS 函数?
  • 我添加了一个sn-p。
【解决方案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;
}

【讨论】:

    猜你喜欢
    • 2016-10-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-11-19
    • 1970-01-01
    相关资源
    最近更新 更多