未创建骨干关系相关模型

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

});

任何帮助概述我做错了什么将不胜感激。

谢谢

编辑

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

如果您不努力手动设置属性，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"
        }
    ]
}

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

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

其他说明

• Backbone 期望ID 字段默认命名为“id”。要将另一个字段用作模型的 ID，请使用 Model.idAttribute
• 我将 Bookings 集合的“键”更改为“Bookings”

示例代码：

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() 来更好地控制哪些属性有效和允许。

读取和设置主干模型属性的规范方法是通过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"