0

私のコントローラーに対して、リストを表示したいアイテムの配列を持つアイテムがあり、アイテムを削除するアクションがあります。

ember.js コレクション ビュー での同様の質問 item-specific actions からほとんどのコードを取得しました。これの大部分は機能し、住所表示は機能し、アイテムはレンダリングされますが、アクションは正しいコンテキストを持っていないように見えるため、削除アクションは実行されません。

コントローラ：

App.EditAddressesController = Em.ArrayController.extend({
    temporaryUser: {
        firstName: 'Ben', 
        lastName: 'MacGowan', 
        addresses: [{
            number: '24', 
            city: 'London'
            etc...
        }, {
            number: '23', 
            city: 'London'
            etc...
        }]
    }
});

temporaryUser は EmberObject (User モデルに基づく) であり、addresses 配列内の各アイテムは別の EmberObject (Address モデルに基づく) です - これはコードを表示するために単純化されています。

親ビュー:

{{#each address in temporaryUser.addresses}}
    {{#view App.AddressView addressBinding="this"}}
        {{{address.display}}}
        <a {{action deleteAddress target="view"}} class="delete">Delete</a>
    {{/view}}
{{/each}}

App.AddressView:

App.AddressView = Ember.View.extend({
    tagName: 'li', 
    address: null, 
    deleteAddress: function() {
        var address = this.get('address'), 
        controller = this.get('controller'), 
        currentAddresses = controller.get('temporaryUser.addresses');
        if(currentAddresses.length > 1) {
            $.each(currentAddresses, function(i) {
                if(currentAddresses[i] == address) {
                    currentAddresses.splice(i, 1);
                }
             });
        }
        else {
            //Throw error saying user must have at least 1 address
        }
    }
});
4

2 に答える 2

0

そのようにアプローチすると、コードが読みやすくなると思います。

1-アクションヘルパーを変更して、アドレスをコンテキストとして渡すようにします。私はあなたのハンドルバーを少し修正して、私がこのようなものにアプローチしていて、私のために働いている方法を反映させました. テンプレートのプロパティは常に、対応するビューのコンテキスト プロパティに対するルックアップであるため、これはこの種のことを行う「Ember の方法」だと思います。

{{#each address in temporaryUser.addresses}}
    {{#view App.AddressView contextBinding="address"}}
        {{{display}}}
        <!-- this now refers to the context of your view which should be the address -->
        <a {{action deleteAddress target="view" this}} class="delete">Delete</a>
    {{/view}}
{{/each}}

2 -ビューのハンドラーを変更して、アドレスをパラメーターとして受け入れるようにします。

App.AddressView = Ember.View.extend({
    tagName: 'li', 
    address: null, 
    deleteAddress: function(address) {
        var controller = this.get('controller'), 
        currentAddresses = controller.get('temporaryUser.addresses');
        if(currentAddresses.length > 1) {
            currentAddresses.removeObject(address);
        }
        else {
            //Throw error saying user must have at least 1 address
        }
    }
});
于 2013-02-19T19:14:54.820 に答える
0

それが私のそれぞれの問題であることがわかりました：

{{#each address in temporaryUser.addresses}}

になるはずだった：

{{#each temporaryUser.addresses}}

そして、私の AddressView は removeObject を使用する必要があります (元のコード サンプルのように)

App.AddressView = Ember.View.extend({
    tagName: 'li', 
    address: null, 
    deleteAddress: function() {
        var address = this.get('address'), 
        controller = this.get('controller'), 
        currentAddresses = controller.get('temporaryUser.addresses');
        if(currentAddresses.length > 1) {
            currentAddresses.removeObject(address);
        }
        else {
            //Throw error saying user must have at least 1 address
        }
    }
});
于 2013-02-19T12:27:13.700 に答える