如何在Knockout Extender中使用JQuery函数

Question

如何在自定义敲出扩展器中使用jQuery函数。下面是一个从自定义扩展器向knockout目标添加类的示例。

ko.extenders.addClass = function(target, option) {
    if (option == true)
    {
        target.subscribe(function(newValue) {
            $(this.target).addClass('new_class');
        });
    }
    return target;
}

Answer 1

将普通的dirty-flag与css绑定结合起来。

ko.dirtyFlag = function(root) {
    var result = function() {}, // A function will not get serialized to JSON
        _initialState = ko.observable(ko.toJSON(root));

    result.isDirty = ko.dependentObservable(function() {
        return _initialState() !== ko.toJSON(root);
    });

    result.reset = function() {
        _initialState(ko.toJSON(root));
    };

    return result;
};

function ViewModel() {
    // Normal properties
    this.someProperty = ko.observable("initial value");

    // Dirty-flag for this object.
    this.dirtyFlag = ko.dirtyFlag(this);
}

<div data-bind="css: { 'new_class': dirtyFlag.isDirty }"></div>

如果只想跟踪属性的一个子集，还可以传递一个可观察对象或一个可观察对象数组。

this.dirtyFlag = ko.dirtyFlag(this.someProperty);

http://jsfiddle.net/MizardX/7esdy/