骨干嵌套集合

Question

我有一个骨干应用程序检索服务器的应用程序。这些数据是酒店和foreach酒店，我有更多的房间。我已经分成宾馆成JSON和另一房间内的JSON像这样：

hotel.json

[ 
    { 
    "id": "1", 
    "name": "Hotel1" 
    }, 
    { 
    "id": "2", 
    "name": "Hotel2" 
    }, 
    { 
    "id": "3", 
    "name": "Hotel3" 
    } 
] 

rooms.json

[ 
    { 
    "id" : "r1", 
    "hotel_id" : "1", 
    "name" : "Singola", 
    "level" : "1" 
    }, 
    { 
    "id" : "r1_1", 
    "hotel_id" : "1", 
    "name" : "Doppia", 
    "level" : "2" 
    }, 
    { 
    "id" : "r1_3", 
    "hotel_id" : "1", 
    "name" : "Doppia Uso singol", 
    "level" : "1" 
    }, 
    { 
    "id" : "r2", 
    "hotel_id" : "2", 
    "name" : "Singola", 
    "level" : "1" 
    }, 
    { 
    "id" : "r2_1", 
    "hotel_id" : "2", 
    "name" : "Tripla", 
    "level" : "1" 
    } 
] 

我想利用每家酒店和其客房结合（外部键入rooms.jsonhotel_id）并打印房间的组合：每个级别组合不同的房间。 1级的

一个房间，第2级的一个房间和水平中的一个房间3.

水平的最大是3，但我只能有一个电平或只有两个级别。 如果我有3个级别，我不想1级和2级的组合没有3级

像这样的事情

Room "Single", "level" : "1" , "hotel_id" : "1" 
Room "Double", "level" : "2" , , "hotel_id" : "1" 
Room "Triple", "level" : "3" , , "hotel_id" : "1" 

---

Room "Double for single", "level" : "1" , "hotel_id" : "1" 
Room "Double", "level" : "2" , , "hotel_id" : "1" 
Room "Triple", "level" : "3" , , "hotel_id" : "1" 

的这个房间，我认为是构造函数将renderRooms放入我的应用程序中。

这是我的应用程序：

var Room = Backbone.Model.extend(); 
var Rooms = Backbone.Collection.extend({ 
    model: Room, 
    url: "includes/rooms.json" 
}); 
var Hotel = Backbone.Model.extend({ 
    defaults: function() { 
     return { 
      "id": "1", 
      "name": "Hotel1", 
      "rooms": [] 
     } 
    } 
}); 
var HotelCollection = Backbone.Collection.extend({ 
    model: Hotel, 
    url: "includes/test-data.json", 
    initialize: function() { 
     console.log("Collection Hotel initialize"); 
    } 
}); 
var HotelView = Backbone.View.extend({ 
    template: _.template($("#hotel-list-template").html()), 
    initialize: function() { 
     this.collection = new HotelCollection(); 
     this.collection.bind('sync', this.render, this); 
     this.collection.fetch(); 
    }, 
    render: function() { 
     console.log('Data hotel is fetched'); 
     this.bindRoomToHotel(); 
     var element = this.$el; 
     element.html(''); 
    }, 
    bindRoomToHotel: function() { 
     allRooms = new Rooms(); 
     allRooms.on("sync", this.renderRooms, this) 
     allRooms.fetch(); 
    }, 
    renderRooms: function() { 


     $(this.el).html(this.template({ hotels: this.collection.models })); 
    } 
}); 

var hotelView = new HotelView({ 
    el: $("#hotel") 
}); 

我怎么能创造这个房间组合并打印出来？
有没有好的方法或有更好的方法？

Answer 1

这里是你如何结构类别：

HotelModel = Backbone.Model.extend({ 
    initialize: function() { 
     // because initialize is called after parse 
     _.defaults(this, { 
      rooms: new RoomCollection 
     }); 
    }, 
    parse: function(response) { 
     if (_.has(response, "rooms")) { 
      this.rooms = new RoomCollection(response.rooms, { 
       parse: true 
      }); 
      delete response.rooms; 
     } 
     return response; 
    }, 
    toJSON: function() { 
     var json = _.clone(this.attributes); 
     json.rooms = this.rooms.toJSON(); 
     return json; 
    } 
}); 

RoomModel = Backbone.Model.extend({ 
}); 

HotelCollection = Backbone.Collection.extend({ 
    model: HotelModel 
}); 

RoomCollection = Backbone.Collection.extend({ 
    model: RoomModel 
}); 

然后，你可以做这样的事情：

var hotels = new HotelCollection(); 
hotels.reset([{ 
    id: 1, 
    name: 'Hotel California', 
    rooms: [{ 
     id: 1, 
     name: 'Super Deluxe' 
    }] 
}], { 
    parse: true // tell the collection to parse the data 
}); 

// retrieve a room from a hotel 
hotels.get(1).rooms.get(1); 

// add a room to the hotel 
hotels.get(1).rooms.add({id:2, name:'Another Room'});