Javascript 使用Knockout.js、冲突的jQuery.tmpl和Knockout Sortable控制Flash插件

我正在尝试使用Knockout.js的原生模板功能来呈现嵌入Flash对象的HTML。tmpl很好地完成了这项工作，但是我不能使用它，因为它与Knockout-sortable插件冲突

下面是一个使用本机模板的flash插件的例子：
在Chrome中，玩家永远不会出现。在Firefox中，如果选中复选框时更改频道，播放器将显示。然而，重新检查盒子会使玩家再次消失

“如果”绑定是必要的，因为在页面期间可能会有许多flash插件加载和卸载实例

据我所知，当对象/嵌入标记进入可见DOM时，HTML需要全部就位。这就是为什么jQuery.tmpl在我的情况下会很好。我自己也尝试过生成HTML字符串，但我不知道如何应用和维护新标记包含的绑定

总之，我需要一种在仍然支持绑定的情况下立即呈现HTML的方法，或者找到一种使jQuery.tmpl和Knockout sortable相互兼容的方法

---

下面是一个不兼容的示例：
只要不引用jQuery.tmpl，该示例中的代码就可以完美地工作

---

控制台中的错误消息似乎暗示没有正确调整上下文，或者更确切地说，暗示的foreach没有执行。在这个调整中，

子项

对象被替换为简单字符串，消息变得更加不寻常：

我不确定jQuery-Tmpl的不兼容性。我将不得不进一步研究这个问题。不过，如果您不需要为此目的而使用jquerytmpl，那就太好了

看起来有些浏览器（尤其是Chrome浏览器）在动态设置

embed

元素上的

src

时出现问题。这里有一个问题：。这里有一个类似的问题：

因此，为了实现这一点，我们必须避免在元素上使用

attr

绑定，因为它会导致这个问题

一个简单的方法是在

对象

元素上使用

html

绑定，而不必返回到不同的模板引擎。就像：

<p data-bind="if: StreamEnabled">
  <object width="320" height="240" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" data-bind="html: Template">
  </object>
</p>​

​

使用类似JavaScript的：

var ViewModel = function() {
    this.StreamEnabled = ko.observable(false);
    this.Channel = ko.observable("saltwatercams");
    this.Template = ko.computed(function() {
        return "<param name=\"movie\" value=\"" + this.Channel() + "\"></param><embed width=\"320\" height=\"240\" type=\"application/x-shockwave-flash\" src=\"http://cdn.livestream.com/grid/LSPlayer.swf?channel=" + this.Channel() + "\"></embed>";
    }, this);
};

var ViewModel=function（）{
this.streamnabled=ko.可观察（假）；
该通道=可观测的（“盐水摄像头”）；
this.Template=ko.computed（函数（）{
返回“”；
}，这个）；
};

不幸的是，我们需要在视图模型中构建“模板”，但这似乎是解决这个问题的合理方法

此处示例：

---

作为替代，您可以考虑使用自定义绑定。可能是克隆节点、应用attr绑定并将其与原始节点交换的节点。这将避免在视图模型中嵌入模板。除了这个场景之外，我看不到这个绑定的其他用途，但这里有一个示例实现：

非常聪明的解决方法。在我的例子中，您的替代解决方案更可取，但是它似乎有一个小问题，即当通道属性更新时，自定义绑定处理程序不会更新。我不认为绑定被应用到克隆的元素上，而且我觉得如果绑定被应用到克隆的元素上，将会有一个无限循环。另一方面，您知道对象标记在动态更新参数时是否有类似的怪癖吗？是的，自定义绑定不正确。KO在识别出绑定所在的元素已消失时处理绑定，因此此技术不起作用。我将不得不玩它一点，看看是否有一个像样的替代品。