Knockout.Js Array filter syntax

问题:

Just getting into javascript and knockout.js. I've found a bunch of examples of what I'm trying to accomplish. And I feel like there is a small syntax error I may be overlooking. I'm trying to filter a set already returned (this.tasks) from a server via ajax/json. I have that working fine. What I would like to do, is have users be able to switch between complete and incomplete tasks.

I switched the code to just run the foreach loop on tasksFiltered. "this.done" is either true or false.

Task template

var taskModel = function(id, title, description, done){
    var self = this;
    this.id = ko.observable(id);
    this.title = ko.observable(title);
    this.description = ko.observable(description);
    this.done = ko.observable(done);

    this.showEdit = ko.observable(false);
    this.titleUpdate = ko.observable(false);
    this.descriptionUpdate = ko.observable(false);
};

Page Model

var pageModelTasks = function(){
    var self = this;
    this.task_title = ko.observable("");
    this.task_description = ko.observable("");
        this.task_title_focus = ko.observable(true);
    this.tasks = ko.observableArray([]);

    this.tasksFiltered = ko.computed(function() {
        return ko.utils.arrayFilter(this.tasks, function(Task) {
        return Task.done == true;
      });
    });

   // CRUD functions excluded 
}; 

this doesn't work.

回答1:

Two minor corrections to your code. First, as @XGreen mentioned, you need to pass the array value, not the observableArray instance, as the first parameter of the arrayFilter function. Lastly, because Task.done is observable, you need to invoke the member to get the value. Here's the modified code:

this.tasksFiltered = ko.computed(function() {
    return ko.utils.arrayFilter(this.tasks(), function(Task) {
        return Task.done() === true;
    });
});

回答2:

The second solution has a problem with the method ko.utils.stringStartsWith.

ko.utils.stringStartsWith missing in release file.

You can use this code:

  var stringStartsWith = function (string, startsWith) {          
        string = string || "";
        if (startsWith.length > string.length)
            return false;
        return string.substring(0, startsWith.length) === startsWith;
    };

See Issue Link

回答3:

It might help you

if (myList().length > 0) {
    var text= this.filter().toLowerCase();
    return ko.utils.arrayFilter(myList(), function (item) {
                if (item.Label.toLowerCase().indexOf(text) > -1 || item.Desc.toLowerCase().indexOf(text) > -1) {
                    return true;
                 }
                 else {
                     return false;
                 }
          });
}