Question

我正在尝试创建一个嵌套的关系骨干项目，但我真的很挣扎。我正在尝试做的粗略概念如下所示，但我在客户端调用fetch（）时会有一些印象，根据作为JSON返回的预订会自动创建一些预订。

我的JSON格式可以在MVC的大纲下看到：

/****************************************************
/* CLIENT MODEL - Logically the top of the tree
/* has a BookingsCollection containing numerous Booking(s)                                                                             
/*  Client
/*      -Bookings               [BookingsCollection]
/*          -Booking            [Booking]
/*          -Booking            [Booking]
/*****************************************************/
var Client = Backbone.RelationalModel.extend({

    urlRoot: '/URL-THAT-RETURNS-JSON/',

    relations: [
        {
            type: Backbone.HasMany,
            key: 'Booking',
            relatedModel: 'Booking',
            collectionType: 'BookingsCollection'
        }
    ],

    parse: function (response) {

    },

    initialize: function (options) {
        console.log(this, 'Initialized');
    }

});


var Booking = Backbone.RelationalModel.extend({

    initialize: function (options) {
        console.log(this, 'Initialized');
    }

});

var BookingsCollection = Backbone.Collection.extend({

    model: Booking

});

Approximate JSON being returned

任何帮助概述我做错了什么都会受到大力赞赏。

由于

修改

感谢您抽出时间发布反馈，这正是我所希望的。

如果您没有手动设置属性，JSON是否在物理上定义了模型的实际属性？换句话说，如果我回来的JSON就像你上面所建议的那样，Backbone会简单地创建一个Client对象（具有4个属性id，title，firstname和surname）以及2个Booking对象（每个具有4个属性和大概是BookingsCollection的每个成员？？

如果是这种情况，引用每个对象的属性的格式是什么？当我设置一个非骨干关系迷你应用程序时，我最终会遇到一种情况，我可以使用Client.Attribute或Booking [0] .EventDate来引用这些属性。我似乎无法使用您在上面概述的格式执行此操作。

再次感谢。

Answer 1

返回的JSON不是默认情况下Backbone或Backbone-Relational所期望的。

Backbone和Backbone-Relational的期望是：

{
    "id": "123456",
    "Title":"Mr",
    "FirstName":"Joe",
    "Surname":"Bloggs",
    "Bookings": [
        {
            "id": "585462542",
            "EventName": "Bla",
            "Location":"Dee Bla",
            "EventDate":"November 1, 2012"
        },
        {
            "id": "585462543",
            "EventName": "Bla",
            "Location":"Dee Bla",
            "EventDate":"November 1, 2012"
        }
    ]
}

要使用您的回复，您需要在客户端模型上创建一个parse函数，该函数返回我在上面发布的结构。

使用我的示例JSON的模型定义的jsFiddle示例：http://jsfiddle.net/edwardmsmith/jVJHq/4/

其他说明

Backbone希望ID字段默认命名为“id”。要将其他字段用作模型的ID，请使用Model.idAttribute
预订系列的“关键”我改为“预订”

示例代码：

Client = Backbone.RelationalModel.extend({

    urlRoot: '/URL-THAT-RETURNS-JSON/',

    relations: [
        {
            type: Backbone.HasMany,
            key: 'Bookings',
            relatedModel: 'Booking',
            collectionType: 'BookingsCollection'
        }
    ],

    parse: function (response) {

    },

    initialize: function (options) {
        console.log(this, 'Initialized');
    }

});


Booking = Backbone.RelationalModel.extend({

    initialize: function (options) {
    console.log(this, 'Initialized');
    }

});

BookingsCollection = Backbone.Collection.extend({

    model: Booking

});

myClient = new Client(    {
        "id": "123456",
        "Title":"Mr",
        "FirstName":"Joe",
        "Surname":"Bloggs",
        "Bookings": [
            {
                "id": "585462542",
                "EventName": "Bla",
                "Location":"Dee Bla",
                "EventDate":"November 1, 2012"
            },
            {
                "id": "585462543",
                "EventName": "Bla",
                "Location":"Dee Bla",
                "EventDate":"November 1, 2012"
            }
        ]
    });


console.log(myClient);

发布修改

是的，JSON几乎定义了模型的属性。您可以结合使用parse()，defaults和validate()来更好地控制哪些属性有效且允许使用。

在Backbone模型上阅读和设置属性的规范方法是通过get()，escape()和set()函数。

set特别重要，因为它可以进行大量的内务管理，例如验证validate函数（如果有）的属性和值，并触发视图的更改事件正在倾听。

在本答案的具体情况中，您可能

myClient.get('Title');  // => "Mr"
myClient.get('Bookings'); //=> an instance of a BookingsCollection with 2 models.
myClient.get('Bookings').first().get('Location'); //=> "Dee Bla"
myClient.get('Bookings').last().get('Location');  //=> "Dee Bla"
myClient.get('Bookings').first().set({location:"Bora Bora"}); 
myClient.get('Bookings').first().get('Location'); //=> "Bora Bora"
myClient.get('Bookings').last().get('Location');  //=> "Dee Bla"

Backbone-Relational相关模型未创建

1 个答案: