ノックアウトjs removeがうまくいきません

Question

私はノックアウトjsのオブザーバブルの周りに頭を抱えようとしています！ しかし、私はobservable配列のremove関数を実装する際に問題に直面しています。

$(function() { 
    var data = [{ name: "name1" }, { name: "name2" }, { name: "name3"}]; 
    var viewModel = { 
     namesList: ko.observableArray(data), 
     nameToAdd: ko.observable("name4"), 
     myCustomAddItem: function() { 
      this.namesList.push({ name: this.nameToAdd() }); 
     }, 
     myCustomRemove: function() { 
      console.log("before + " + this.nameToAdd()); 
      this.namesList.remove(this.nameToAdd()); 
      console.log("after + " + this.nameToAdd()); 
     } 
    }; 
    ko.applyBindings(viewModel); 
}); 

と私のHTMLは次のとおりです：

私のjsファイルは以下の通りである

Name To add/remove <input type="text" data-bind="value: nameToAdd, valueUpdate: 'afterkeydown'"/> 
<ul data-bind="template: {name: 'listTemp1', foreach :namesList}"> 

</ul> 
<p> 
    <button data-bind="click: myCustomAddItem">Add Item</button> 
    <button data-bind="click: myCustomRemove">Remove Item</button> 

    <script id="listTemp1" type="text/html"> 
     <li data-bind="text:name"> </li> 
    </script> 
</p> 

私myCustomAddItemが正常に動作しますが、ないmyCustomRemove。 this.namesList.remove(this.nameToAdd());の前と後にconsole.logを入れてそこに何か問題があるかどうかを確認しましたが、そこにエラーはありません。 「アイテムを削除」ボタンをクリックすると、Firebugコンソールにログが表示されますが、アイテムはリストから削除されません。

すべてのヘルプはremoveに

Answer 1

にパラメータを高く評価し、何かを削除するかどうかでtrueまたはfalseを返す関数でなければなりません。

filterと非常によく似た働きをします。

お使いの場合には

、このような何かが動作するはずです：

myCustomRemove: function() { 
    console.log("before + " + this.nameToAdd()); 

    var nameToAdd = this.nameToAdd(); 
    this.namesList.remove(function(item) { 
     //'item' will be one of the items in the array, 
     //thus we compare the name property of it to the value we want to remove 
     return item.name == nameToAdd; 
    }); 

    console.log("after + " + this.nameToAdd()); 
} 

Answer 2

ほんの少しの明確化[これはヤニの答えにコメントする必要がありますが、私はまだ投稿他人にコメントすることはできません、申し訳ありません]：技術的には、削除する要素を渡すremove（）を呼び出すことができます。http://knockoutjs.com/documentation/observableArrays.htmlのセクション「remove and removeAll」を参照してください。

あなたのコードの問題は、 'data'配列の要素がオブジェクト（ 'name'というプロパティを含む）であり、配列から文字列 "name4"（または何らかの 'nameToAdd'含まれています）。

あなたはこのように、削除するために渡すために新しいオブジェクトを作成するように誘惑することができます（例えば、以下を参照してください。How to determine equality for two JavaScript objects?）の方法javascriptオブジェクトの平等が動作するため、

// old code 
//this.namesList.remove(this.nameToAdd()); 
this.namesList.remove({ name: this.nameToAdd() }); 

が、これはまだ失敗。

最後に、とにかく関数を使用する必要があります。

この単純な例では、 'namesList'配列を文字列の単純な配列に変換し、テンプレートに "$ data"をバインドすることもできます。 http://jsfiddle.net/saurus/usKwA/を参照してください。 もっと複雑なシナリオでは、オブジェクトの使用を避けることはできません。

Answer 3

[observableArray] .remove（function（item）{戻り値。[任意] == [somevalue];}）;