Backbone.js的：做取（）后，仅呈现新车型 [英] Backbone.js: After doing Fetch(), render only the new models

问题描述

我有一个Collection App.listingList 其中，随后取（）被称为与补充：真。

  App.listingList.fetch（{
        数据：{部分：数据}，
        过程数据：真实，
        补充：真
}）;
 

问题：新加入的机型怎么能有自己的看法呈现，而无需重新渲染现有车型的看法。这意味着我不能做的：

  this.collection.each（功能（上市，指数）{
    新ListingMarkerView（{模式：上市}）渲染（）;
}， 这个）;
 

尝试＃1

渲染视图上的集合的添加事件，我不能想出一个办法来访问新的模型来展示

  ListingListView = Backbone.View.extend（{    初始化：功能（）{
        this.collection.bind（添加，this.renderNew，这一点）;
    }，    渲染：功能（）{
        的console.log（'渲染ListingListView'）;
        this.collection.each（功能（上市，指数）{
            新ListingMarkerView（{模式：上市}）渲染（）;
        }， 这个）;
        返回此;
    }，    renderNew：功能（）{
        //我如何抓住新的模式？
        新ListingMarkerView（{模式：上市}）渲染（）; //不会工作
        返回此;
    }
}）;
 

尝试＃2

我试过有第二集合做后续的取，并比较使用underscore.js的 _。没有两个集合的模型（ ），但返回数组仍然包含作为参数传递的第二个数组中的元素。使用 _difference（）也恢复为第一数组传递相同的数组。

  App.listingListNew.fetch（{
        数据：{部分：数据}，
        过程数据：真实，
        成功：函数（）{
            的console.log（App.listingListNew.models）;
            的console.log（App.listingList.models）;
            的console.log（_无（App.listingListNew.models，App.listingList.models））;
            的console.log（_差（App.listingListNew.models，App.listingList.models））;
        }
}）;
 

的console.log 输出

由于我通过了2个相同的阵列到 _。差（）和 _。没有（）中，输出应为 [] 。但它不是：/也许是因为 CID 是不同的，因此他们每个人都是独特治疗

？

解决方案

当你做了 collection.bind（添加，this.renderNew，这一点）; 它添加的模型自动传递给你的方法作为参数。<​​/ p>

包括在你方法的参数，你应该有机会获得新的模式。

  renderNew：功能（newModel，并向）{
    新ListingMarkerView（{模式：} newModel，并向）渲染（）;
    返回此;
}
 

I have a Collection App.listingList where subsequent fetch() are called with add:true.

App.listingList.fetch({
        data: {some:data},
        processData: true,
        add: true
});

Problem: How can the newly added models have their views rendered, without re-rendering the views of the existing models. This means I cannot do:

this.collection.each( function(listing, index) {
    new ListingMarkerView({ model:listing }).render();
}, this);

Attempt #1

Rendering the View on the collection's add event, I cannot figure out a way to access the new models to render

ListingListView = Backbone.View.extend({

    initialize: function() {
        this.collection.bind('add', this.renderNew, this);
    },

    render: function() {
        console.log('render ListingListView');
        this.collection.each( function(listing, index) {
            new ListingMarkerView({ model:listing }).render();
        }, this);
        return this;
    },

    renderNew: function() {
        // How do I grab the new models?
        new ListingMarkerView({ model:listing }).render(); // wont work
        return this;
    }
});

Attempt #2

I tried having a second Collection to do the subsequent fetch on, and compare the models of both collections using underscore.js's _.without(), but the array returned still contains the elements found in the 2nd array passed as the parameter. Using _difference() also returned the same array passed as the first array.

App.listingListNew.fetch({
        data: {some:data},
        processData: true,
        success: function() {
            console.log(App.listingListNew.models);
            console.log(App.listingList.models);
            console.log(_.without(App.listingListNew.models, App.listingList.models));
            console.log(_.difference(App.listingListNew.models, App.listingList.models));
        }
});

console.log Output

Since I passed in 2 identical arrays into _.difference() and _.without(), the output should be []. But it isnt :/ Maybe because cid is different, so every one of them are treated as unique?

解决方案

When you do a collection.bind('add', this.renderNew, this); it automatically passes the added model to your method as an argument.

Include the argument in your method and you should have access to the new model.

renderNew: function(newModel) {
    new ListingMarkerView({ model:newModel }).render();
    return this;
}

这篇关于Backbone.js的：做取（）后，仅呈现新车型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！