检测Knockout视图模型的更改

Question

当然这是一个非常容易回答的问题,但有一种简单的方法可以确定淘汰视图模型的任何属性是否已经改变？

Answer 1

使用扩展器:

ko.extenders.trackChange = function (target, track) {
    if (track) {
        target.isDirty = ko.observable(false);
        target.originalValue = target();
        target.setOriginalValue = function(startingValue) {
            target.originalValue = startingValue; 
        };
        target.subscribe(function (newValue) {
            // use != not !== so numbers will equate naturally
            target.isDirty(newValue != target.originalValue);
        });
    }
    return target;
};

然后:

self.MyProperty= ko.observable("Property Value").extend({ trackChange: true });

现在你可以像这样检查:

self.MyProperty.isDirty()

您还可以编写一些通用的viewModel遍历,以查看是否有任何更改:

self.isDirty = ko.computed(function () {
    for (key in self) {
        if (self.hasOwnProperty(key) && ko.isObservable(self[key]) && typeof self[key].isDirty === 'function' && self[key].isDirty()) {
            return true;
        }
    }
});

...然后只需检查viewModel级别

self.isDirty()

Answer 2

您可以订阅要监视的属性:

myViewModel.personName.subscribe(function(newValue) {
    alert("The person's new name is " + newValue); 
});

当personName更改时,这将发出警报.

好的,所以你想知道模型什么时候发生变化......

var viewModel = … // define your viewModel

var changeLog = new Array();  

function catchChanges(property, value){
    changeLog.push({property: property, value: value});
    viewModel.isDirty = true;
}

function initialiseViewModel()
{
    // loop through all the properties in the model
    for (var property in viewModel) {

        if (viewModel.hasOwnProperty(property)) { 

            // if they're observable
            if(viewModel[property].subscribe){

                // subscribe to changes
                viewModel[property].subscribe(function(value) {
                    catchChanges(property, value);
                });
            }
        }
    }
    viewModel.isDirty = false;
}

function resetViewModel() {
    changeLog = new Array();  
    viewModel.isDirty = false;
}

(没有测试过 - 但你应该明白了)

Answer 3

考虑使用Knockout-Validation插件

它实现了以下内容:

yourProperty.isModified() - 检查用户是否修改了该值.

yourProperty.originalValue - 因此您可以检查值是否真的发生了变化.

与其他验证的东西一起派上用场!

干杯