2013-10-25 2 views
0

Я ищу, чтобы построить свой сайт, используя backbone.js. Мой API возвращает URL-адрес другим различным ресурсам (не строгий HAL, иначе может быть this будет в порядке), но мне сложно создавать сводные страницы (например, страницы с содержимым из нескольких моделей/коллекций).Backbone.js с URL-адресом для вложенных коллекций

Например, У меня есть страница «Сделки», на которой отображается список сделок. Каждая сделка отображает количество билетов для этой конкретной сделки. Плохая практика выполнения выборки во время рендеринга страницы и Backbone-Relational выглядит многообещающе, но я не уверен, как Я могу использовать его со ссылками на соответствующие URL-адрес коллекции Извините, если это глупый вопрос, я новичок в этих рамках

Частичный пример «Deal»:..

{ 
    "_id": "526a6f520188d9c0e300002a", 
    "name": "test", 
    "description": "", 
    "isPublished": false, 
    "images": [], 
    "dealType": "group", 
    "tickets": "http://[host]/1/deals/526a6f520188d9c0e300002a/tickets" 
} 

Любой совет будет очень благодарен!

+0

Backbone-Relational Предположим, вы вложенная модель в возвращаемом json с сервера (или просто некоторые части, такие как id или просто массив идентификаторов). '{id: 'awd', ..., tickets: ['1', '2', ...]}' или '{id: 'awd', ..., tickets: [{id: '1 ', ticketKey:' awdddawd ', ...}, ...]} ' –

ответ

1

Похоже, это то, что вы ищете.

var DealModel = Backbone.Model.extend({ 
    initialize:function(){ 
     var self = this; 
     self.ticketsCollection = new (Backbone.Collection.extend({ 
      url:self.get('tickets') 
     })) 

     self.listenTo(self.ticketCollection, 'all', function (sourceEventName) { 
      self.trigger.apply(self, ['ticket:' + sourceEventName].concat(_.rest(arguments))); 
     }) 

     this.ticketsCollection.fetch(); //this can be done only when you want tickets details 
    } 
}) 

var DealCollection = Backbone.Collection.extend({ 
    model:DealModel, 
    url:'urltoDeals' 
}) 


var dealCollection = new DealCollection(); 
dealCollection.fetch(); 
+0

благодарит Рави! Это меня очень близко. Я добавил блок успеха в вызове выборки и зарегистрировал правильное количество билетов. Единственное, с чем я все время боюсь, это то, что fetch() - это асинхронный вызов. Когда экран отображает, у него пока нет билетов - так оно и есть. Любые мысли о том, как это разрешить? – remotevision

+0

, когда вы планируете виджеты, вам нужно планировать загрузку, nodata, ошибку, состояние переполнения данных. перед извлечением билетов добавьте стиль загрузки к вашему представлению, как только fetch закончен, удалите этот класс –

+0

. Итак, мне как-то нужно связать изменение в this.ticketsCollection с элементом пользовательского интерфейса? – remotevision

Смежные вопросы