如何将 jquery 插件应用于由敲除模板生成的 div

【问题标题】：How to apply a jquery plugin to a div which is generated by knockout template如何将 jquery 插件应用于由敲除模板生成的 div
【发布时间】：2013-12-22 14:12:29
【问题描述】：

想知道我是否可以将 jquery 插件应用于由敲除模板生成的 div。

这是我正在做的事情：我有一个模板

<script type="text/html" id="single-file-image-template">
    <div id="iviewer"></div>
</script>

那么我怎样才能像我在 jquery 风格中所做的那样呢？

  var iv = $('#iviewer').iviewer(
      'loadImage', documentUrl
  );

欢迎提出任何建议！

问候
泽维尔

【问题讨论】：

标签： jquery html data-binding mvvm knockout.js

【解决方案1】：

您可以按如下方式创建自定义绑定：

ko.bindingHandlers.iviewer = {
   init: function (element, valueAccessor, allBindingsAccessor) {
     var value = ko.utils.unwrapObservable(valueAccessor());
       //initialize iviewer with url
      $(element).iviewer('loadImage', value);    
    },

     //update the control when the view model changes
    update: function(element, valueAccessor) {
        var value = ko.utils.unwrapObservable(valueAccessor());
        $(element).iviewer('loadImage', value);
    }
};

并以这种方式使用它：

<div data-bind="iviewer : url">
<div>

ko.applyBindings({ url : 'yourUrl'});

See fiddle

【讨论】：