BackgridJs - Как показать объект в сетке

Question

Я хочу показать сетку для данного документа (модель):

{ 
    id: "53f7ba4b30d2317912fc8004", 
    title: "Hellow world", 
    on_slideshow: false, 
    country: { 
     name: "United state", 
     country_code: "US" 
    } 
    tags: [ 
     { 
      name: "backbonejs" 
      object_id: "72691" 
     }, 
     { 
      name: "backgrid" 
      object_id: "72692" 
     } 
    ] 
} 

в моем файле JS ..

var grid = new Backgrid.Grid({ 
    columns: [{ 
     name: "title", 
     label: "Title", 
     cell: "string" 
    }, 
    { 
     name: "country", 
     label: "Country", 
     cell: "string" 
    }, 
    { 
     name: "on_slideshow", 
     label: "Slide", 
     cell: "boolean" 
    }, 
    { 
     name: "tags", 
     label: "Tags", 
     cell: "string" 
    }, 
    { 
     name: "pub_date", 
     label: "Publiched", 
     cell: "string" 
    }], 
    collection: articles 
}).render(); 

Теги показать, как [объект Object], [object Object] и страна вообще не отображались.

Как я могу показать их правильно, название тегов и список стран?

Answer 1

Backgrid предназначен для создания таблиц для Collection s с данными Model s, данные которых находятся на 1 уровне, но ваш Model имеет данные на двух уровнях. Вы, , можете использовать, чтобы использовать пользовательские форматы или переопределить метод render вашего Column's Cell s, но, вероятно, самым простым решением является просто «сгладить» вашу модель, чтобы облегчить работу Backgrid.

Например:

var Article = Backbone.Model.extend({ 
    flatten: function() { 
     var flatVersion = this.toJSON(); 
     flatVersion.country = this.get('country').name; 
     flatVersion.tags = this.get('tags').join(', '); 
     return new Backbone.Model(flatVersion); 
    } 
}); 

, а затем добавить подобный метод Свести к вашему Collection:

var Articles = Backbone.Collection.extend({ 
    flatten: function() { 
     return this.invoke('flatten'); 
    } 
}); 

, а затем, наконец, пройти сплющенный версию для Backgrid:

var grid = new Backgrid.Grid({ 
    ... 
    collection: articles.flatten() 
}); 

Надежда что помогает.