设置observable值后清除jQuery事件

时间:2012-10-08 06:06:59

标签: javascript jquery knockout.js

我有一个初始化函数应用Knockout绑定并使用jQuery委托绑定其他一些事件。

init = function (){

    ko.applyBindings(_data);

    $('#tabs').tabs();

    $('#container').delegate(".expand_all", "click", (function () {...})
}

视图模型有一个observable和一个在ajax调用后改变observable的函数:

function(data){

    var self = this;
    var name = ko.observable(data.name);

    self.changeName = function(){
        getName(function(data){
            ......
            self.name(data.name);
            ......
            ......
        }
    }
}

HTML标记

<div id="container">
    <a href='#' data-bind='click: changeName'></a>
    <div id="tabs">
          <ul>
                 <li>......</li>
                 <li>......</li>
          </ul>
    </div>
    <a href='#' class="expand_all"></a>
</div>

奇怪的是,在触发changeName之后,#tar和#div上的事件绑定都已丢失。

任何人都可以解释一下吗?

2 个答案:

答案 0 :(得分:2)

knockout.js可观察量应该是公开的,而不是私人的:

self.name = ko.observable(data.name);

正如所写的那样,self.name()回调中没有self.changeName()函数可用,因为name变量被错误地声明为私有。

您很可能会在浏览器的控制台中找到异常。

答案 1 :(得分:1)

自定义绑定会解决您的问题吗?

ko.bindingHandlers.myBindingName = {
    init: function(element, valueAccessor, 
                   allBindingsAccessor, viewModel, bindingContext) {

        var $elem = $(element);
        // Apply event handler on $elem

    },
    update: function(element, valueAccessor, 
                     allBindingsAccessor, viewModel, bindingContext) {

        // Handle value updated here

    }
};

在你的标记中:

<a href='#' data-bind='myBindingName: changeName'></a>