-1

さまざまな API からポッドキャストをプルするバックボーン プロジェクトがあります。

私が対処したい問題は、現在表示されているすべてのビューを削除することです。「削除」アンカーがクリックされたときに発生する各ビューにイベントをバインドすることで、これを実行したいと考えています。

現在、コレクションのリセットが発生し、すべてのモデルが削除されますが、ビューも破棄されていることを確認する方法がありません。私の論理には助けが必要だと思います。

これが私のコードです：

podSearch = Backbone.Model.extend();
podSearchCollection = Backbone.Collection.extend({
    model: podSearch,
    parse: function(response) {
        return response.results;
    }
});

ownerList = Backbone.Model.extend();
ownerListCollection = Backbone.Collection.extend({
    model: ownerList,
    parse: function(response) {
        return response.results;
    }
});

Search = Backbone.View.extend({
    initialize: function(){
        this.searchCollection = new podSearchCollection();
        this.searchCollection.bind('reset', this.appendResult, this);
    },
    events: {
        "click button" : "getTerm"
    },
    doSearch: function(term){
        /* get term and collection url */
        this.searchCollection.fetch();
    },
    appendResult: function(){
        _.each(this.searchCollection.models, function (item) {
            var listItem = new ownerItem({model:item});
            $('#results').append(listItem.render().el);
        });
    },
    removeAll: function(){
        console.log(this.searchCollection);
        this.searchCollection.reset();
    }
});

ownerItem = Backbone.View.extend({
    template: $("#castOwner").html(),

    initialize: function(){
        this.ownerListCollection = new ownerListCollection();
        this.ownerListCollection.bind('reset', this.appendResult, this);
        this.model.bind("reset", this.removeSelf);
    },
    render: function(){
        var tmpl = _.template(this.template);
        this.$el.html( tmpl( this.model.toJSON() ) );
        return this;
    },
    events: {
        "click a" : "pullCasts",
        "click a.removeAll" : "removeAll"
    },
    pullCasts: function(e){
        e.preventDefault();
        var id = this.$el.find('a').attr("href");
        this.ownerListCollection.url = 'http://itunes.apple.com/lookup?id=' + id + '&entity=podcast&callback=?';
        this.ownerListCollection.fetch();
    },
    appendResult: function(){
        _.each(this.ownerListCollection.models, function(item){
            /* do something with each item */
        }, this);
        $(this.el).append('<p><a href="#" class="removeAll">Remove All</a></p>');
    },
    removeAll: function(){
        search.removeAll();
    },
    removeSelf: function(){
        console.log("rm");
    }
});

search = new Search();
4

1 に答える 1

2

モデルが破棄されたときにビューを削除するには、ビューにリスナーを追加します。これにより、モデルが破棄された場合にビューが削除されます:-

initialize: function () {
    //view gets re-rendered if model is changed
    this.model.on("change", this.render, this);
    //view gets removed if model is destroyed
    this.model.on("destroy", this.remove, this)
},
于 2012-08-14T12:54:46.993 に答える