内容中的第 3 方脚本未在 Durandal 中加载

Question

我的问题在性质上与 here 上发布的问题几乎相似。我正在从包含第三方脚本的数据库中加载 HTML 内容。正如我发现的那样，Durandal 不会加载该脚本，或者更确切地说，视图不会组成该元素。我的 html 内容（来自第 3 方）看起来：

<p id="oilChart"><script src="http://www.oil-price.net/TABLE2/gen.php?lang=en" type="text/javascript">
</script>
<noscript> &amp;amp;amp;amp;lt;a href="http://www.oil-  price.net/dashboard.php?lang=en#TABLE2" mce_href="http://www.oil-price.net/dashboard.php?lang=en#TABLE2"&amp;amp;amp;amp;gt;To get the oil price, please enable Javascript.&amp;amp;amp;amp;lt;/a&amp;amp;amp;amp;gt;&amp;amp;amp;amp;lt;br     /&amp;amp;amp;amp;gt; </noscript>
</p>

main.js 中引用了我的所有其他脚本。我试图以这种方式引用它，然后使用 durandal 的 compositionComplete 到 link 以及我在内容中指定的 id。那没起效。有没有另一种方式来看待它并做到这一点。提前感谢您的帮助。

Answer 1

正如您所指出的，Durandal 将忽略视图中的 script 标记。它们仅从 index.html（或其等效项）加载。

您能否提前引用脚本（和 noscript），将它们放在 index.html 文件中？换句话说，他们有动态加载吗？

旁注："All my other scripts are referenced in the main.js" 是什么意思？你的意思是它们是 RequireJS 的路径配置吗？或者您的意思是说它们在 index.html 文件（或其等效文件）中被引用？

Answer 2

您可以使用 knockout custom bindings:

ko.bindingHandlers.oilPrice = {
  update: function( element, valueAccessor, allBindingsAccessor, viewModel, bindingContext){
  $(element).html('<script src="http://www.oil-price.net/TABLE2/gen.php?lang=en" type="text/javascript"></script><noscript> &amp;amp;amp;amp;lt;a href="http://www.oil-  price.net/dashboard.php?lang=en#TABLE2" mce_href="http://www.oil-price.net/dashboard.php?lang=en#TABLE2"&amp;amp;amp;amp;gt;To get the oil price, please enable Javascript.&amp;amp;amp;amp;lt;/a&amp;amp;amp;amp;gt;&amp;amp;amp;amp;lt;br     /&amp;amp;amp;amp;gt; </noscript>');
  }
};

在您的html中使用它：

<p><span data-bind="oilPrice"></span>

更新如果您使用的是 Knockout 2.2，自定义绑定必须包含值：

<p><span data-bind="oilPrice:'value'"></span>

对于淘汰赛版本 3.2：

<p><span data-bind="oilPrice"></span>

您呈现的脚本：

Answer 3

我进一步调查了OP提出的问题的答案。

我采取了以下步骤：

遵循 Erikas Pliauksta's 建议并创建了自定义 KO 绑定。
稍微修改了绑定以采用布尔标志：false 禁用绑定，true 启用绑定。这允许我用 compositionComplete.

这是我在控制台中返回的屏幕截图：

现在，对 SO 的搜索产生了这个 post。基本上，如果此脚本正在使用 document.write 或其等价物，它将不起作用。

我会回到我最初的建议，即点击网络服务以显示原油数据，而不是像他们所说的那样尝试合并第三方 JavaScript。

Answer 4

经过大量研究，我终于找到了答案。我所要做的就是使用一个 iframe 来加载我的脚本。我替换了这个：

<p id="oilChart"><script src="http://www.oil-price.net/TABLE2/gen.php?lang=en" type="text/javascript"></script></p>

与：

<iframe style ="border: none;height: 235px" srcdoc="<html lang='en'><body><script src='http://www.oil-price.net/TABLE2/gen.php?lang=en'></script></body></html>"><iframe>

感谢所有的想法。从使用异步插件到自定义 Ko 处理程序的可能性中学到了很多东西。

内容中的第 3 方脚本未在 Durandal 中加载

3rd Party script in content not loading in Durandal

jquery

knockout.js

single-page-application

durandal-2.0