Question

我的代码有一个疯狂的问题。我正在尝试实施this jsfiddle code

在我的代码中，但我没有成功。这就是我所做的：

视图模型：

viewModelInbox = function(){
                    query: ko.observable('');
                    var checked = false,
                    mainData = ko.observableArray([]),
                    showView = ko.observable(),
                    currentView = ko.observable(),
                    approve = function(){
                    },

                    disapprove = function(){},
                    toggle = function () {
                        if(checked){
                            $.each(mainData(), function(){
                                this.checkB(false);
                            });
                            checked = false;
                            return;
                        }
                        if(!checked){
                            $.each(mainData(), function(){
                                this.checkB(true);
                            });
                            checked = true;
                            return;
                        }
                    };

                    viewModelInbox.mainData = ko.dependentObservable(function() {
                    var search = this.query().toLowerCase();
                    return ko.utils.arrayFilter(viewModelInbox, function(test) {
                        return test.name.toLowerCase().indexOf(search) >= 0;
                    });

                }, viewModelInbox);
                    return {
                        mainData: mainData,
                        showView: showView,
                        currentView: currentView,
                        approve: approve,
                        disapprove: disapprove,
                        toggle: toggle
                    };

                },

mainData可观察数组包含一些值作为名称，代码，日期等。

我遇到的问题是我收到了这个错误：

TypeError: this.query is not a function 

var search = this.query().toLowerCase();

我很确定我错过了一些非常小的东西，但是因为我是淘汰赛中的一个小伙伴，所以我无法发现它。

Answer 1

看起来不小。

您的视图模型应为

var ViewModel = function() {
    this.query = ko.observable(''); // use ';'
    this.mainData = ko.observableArray([]);
};

或

var viewModel = {
    query: ko.observable(''),  // use ','
    mainData: ko.observableArray([])
};

你不能混合它们。

Answer 2

或者你可以这样写：

var ViewModelInbox = function() {
    var self = this;

    self.query = ko.observable('');

    self.dataSource = []; // data source

    self.mainData = ko.computed(function() {
        var search = self.query().toLowerCase();
        return ko.utils.arrayFilter(self.dataSource, function(item) {
            return item.name.toLowerCase().indexOf(search) >= 0;
        });
    });

    self.showView = ko.observable();
    self.currentView = ko.observable();

    self.approve = function() {

    };

    self.disapprove = function() {

    };

    self.checked = ko.observable(true);

    self.toggle = function() {
        var toCheck = !self.checked();
        ko.arrayForEach(self.mainData(), function(data) {
            data.checkB(toCheck);
        });
        self.checked(toCheck);
    };
};

ko.applyBindings(new ViewModelInbox());

奇怪的数据绑定问题

2 个答案: