5

私はおそらく本当にばかげた何かを見逃しています(Ember初心者)が、まったく新しい配列を設定する以外に、Emberコントローラーの管理下にある配列を変更する方法がわかりません。

例えば。コントローラーに次のテスト機能があります。ユーザーがクリックすると、制御された配列の各要素 (または個々の要素) を新しい値で変更したいと考えています。

Emberに変更を知らせるために「設定」を行う必要があることを理解しているので、これでうまくいくと思いました:

clickHandler:function(e){
    var temp = this.get("itemList").copy(); // copy it
    for (var i = 0; i < temp.length; i++) { 
        temp[i].desc = "CANCELLED";     // change it
    }
    this.set('itemList', temp); // put it back
}

配列のコピーを作成し、変更してから元に戻します。しかしどういうわけか、Ember は temp[i].desc の内容を変更する 4 行目で、Ember.Set を使用しなければならないと文句を言っています。「オフライン」コピーを変更して元に戻すことができると思いましたが、うまくいかず、理由がわかりません。シフト/シフト解除/ポップなどの他の配列操作は機能しているようです。

4

1 に答える 1

12

あなたのアプローチはあまり派手に見えません。このコードは機能します:

clickHandler:function(e){
    var itemList = this.get("itemList");
    itemList.forEach(function(item){ // for iterating over an array, always use the forEach function
        item.set("desc", "CANCELLED"); // you have to call this set()-function to make changes to an Ember Object
    });
}

set() メソッドを呼び出す必要があり、直接アクセス アプローチを使用できないのはなぜですか?

set() メソッドにより、Ember はその自動バインディング マジックを実行できます。このメソッドが呼び出されると、変更されたプロパティに依存するオブジェクトに対して実行する必要があるすべてのものをスケジュールします。最も簡単な例は、更新が必要な特定のプロパティを表示するテンプレートです。

ここで、上記のコードをさらに派手にするための可能な改善: ArrayController を使用して itemList を管理できます。この場合、itemList をコントローラーの content プロパティとして設定します。配列を扱う場合、多くのチュートリアルがこのコントローラーを利用していることに気付くでしょう。

App.ItemListController = Ember.ArrayController.extend({
    content : null, //set your itemList into this property
    clickHandler:function(e){
        this.get("content").setEach("desc", "CANCELLED");
    }
});
于 2013-02-22T23:04:29.913 に答える