骨干嵌套集合 [英] Backbone nested collection

查看:123
本文介绍了骨干嵌套集合的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有骨气一个应用程序,从服务器获取数据。
这个数据是酒店和foreach酒店我有更多的房间。
我已经划分的酒店成JSON这样的另一个JSON内部的房间:
hotel.json

I have an app in backbone that retrieve data from a server. This data are hotels and foreach hotel I have more rooms. I have divided hotel into a json an room inside another json like this: hotel.json

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

rooms.json

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.json HOTEL_ID)和打印的房间组合:的foreach水平结合不同的房间。
水平的一个房间2级的1单间客房和3级的一个房间。结果
水平最高为3,但我只能有一个水平或只有两个级别。
如果我有3级,我不想没有3级1级2级和结合

I wanna take each hotel and combine with its rooms(external key into rooms.json hotel_id) and print the combination of the rooms: foreach level combine different rooms. One rooms of level 1 one rooms of level2 and one rooms of level3.
Maximum of level is 3 but I can have only one level or only two level. If I have 3 level I don't want combination of level1 and level2 without level3

像这样

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我的应用程序。
这是我的应用程序:

The constructor of this rooms I think is to put into renderRooms into my app. This is my app:

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") 
        });

我怎样才能创建这个房间组合和打印?
有一个好办法或者有更好的东西?
请帮我

How can I create this room combination and print it? Is there a good way or there is something better? Please help me

推荐答案

下面是你如何构造的类别:

Here is how you can structure the Collections:

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
});

然后,你可以做这样的事情:

Then you can do something like this:

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'});

这篇关于骨干嵌套集合的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆