Total Backbone js noob，我想了解我正在使用的返回json的API是否不适用于主干（或不适用于任何东西），或者我只是不知道集合和模型如何工作足够还没有在骨干网。
我知道集合的提取正确返回了json，这可能就是我处理响应的方式。令人困惑的是，我真的不知道正确的获取集合会是什么样子，以及在获取之后将模型存储在何处。看来我要成为模型的对象存储为集合的模型属性中的对象...对吗？
另外，我想作为第二个问题，似乎我的收藏集或多或少不是在解析每个模型，而是仅创建一个包含我的模型集的模型。我不确定如何，但是我想反过来，就是我的模型集合。有指针吗？
让我布置一些代码，然后提供json响应的示例（我的示例将仅包含3个对象），以及获取的集合的控制台日志。非常感谢您的帮助和任何建议。谢谢！
我的引导文件：
//statusApp.js
(function($){
var statusGroup = new app.StatusCollection();
var deferred = statusGroup.fetch({
data: {
action: "get_my_status_collection"
}
});
/* wait till fetch is complete */
$.when(deferred).then(function(){
console.log('returned collection', statusGroup);
var statusGroupView = new app.allStatusView({ collection: statusGroup});
$(".service-statuses").html(statusGroupView.render().el);
var statusRouter = new app.Router();
Backbone.history.start();
});
})(jQuery);
下面是收到的响应的示例，其中显示了服务器附带的所有嵌套节点。您会在集合的parse函数中看到，它仅返回“对象”节点，而我不需要其余的（它可能不适用于这些顶级节点吗？）
{
"component":{
"status":"2",
"count":"3",
"objects":{
"80":{
"name":"Calendar",
"parent":"0",
"status":"3",
"description":"Exchange Calendar",
"comment":""
},
"220":{
"name":"Solution Services",
"parent":"0",
"status":"3",
"description":"",
"comment":""
},
"2":{
"name":"Tech Portal",
"parent":"0",
"status":"2",
"description":"",
"comment":""
},
}
},
"in_maint":[],
"success":true
}
这是从集合获取中返回的json的控制台日志：
statusGroup
d {length: 1, models: (...), _byId: Object, url: (...), trigger: function…}
[object Object]: undefined
get [object Object]: function () {
set [object Object]: function (newval) {
__backboneDebugger__appComponentInfo: window.__backboneAgent.AppComponentInfo
__backboneDebugger__isInstancePatched: true
_byId: Object
initialize: function () {
length: 1
models: Array[1]
0: d
__backboneDebugger__appComponentInfo: window.__backboneAgent.AppComponentInfo
__backboneDebugger__isInstancePatched: true
_changing: false
_events: Object
_pending: false
_previousAttributes: Object
attributes: Object
2: Object
comment: ""
description: ""
name: "Tech Portal"
parent: "0"
status: "3"
get 2: function () {
set 2: function (newval) {
80: Object
comment: ""
description: "Exchange Calendar"
name: "Calendar"
parent: "0"
status: "2"
get 80: function () {
set 80: function (newval) {
220: Object
comment: ""
description: ""
name: "Solution Services"
parent: "0"
status: "3"
get 220: function () {
set 220: function (newval) {
watchers: Object
__proto__: Object
get attributes: function () {
set attributes: function (newval) {
changed: Object
cid: (...)
get cid: function () {
set cid: function (newval) {
collection: (...)
get collection: function () {
set collection: function (newval) {
id: (...)
get id: function () {
set id: function (newval) {
initialize: (...)
sync: function (){return b.sync.apply(this,arguments)}
trigger: function (a){if(!this._events)return this;var b=g.call(arguments,1);if(!j(this,"trigger",a,b))return this;var c=this._events[a],d=this._events.all;return c&&k(c,b),d&&k(d,arguments),this}
urlRoot: (...)
get urlRoot: function () {
set urlRoot: function (newval) {
watchers: Object
__proto__: f
get 0: function () {
set 0: function (newval) {
length: 1
pop: function () {
push: function () {
reverse: function () {
shift: function () {
slice: function () {
sort: function () {
unshift: function () {
watchers: Object
__proto__: Array[0]
get models: function () {
set models: function (newval) {
sync: function (){return b.sync.apply(this,arguments)}
trigger: function (a){if(!this._events)return this;var b=g.call(arguments,1);if(!j(this,"trigger",a,b))return this;var c=this._events[a],d=this._events.all;return c&&k(c,b),d&&k(d,arguments),this}
url: (...)
get url: function () {
set url: function (newval) {
watchers: Object
__proto__: f
我的收藏：
// allStatus.js
var app = app || {};
// A group (array) of Status models
app.StatusCollection = Backbone.Collection.extend({
model: app.singleStatus,
url: "/remote/api/status_json",
parse: function(response){
//return only the nested objects that will be our models
return response.component.objects;
}
});
我的收藏集视图：
// allStatusView.js
var $ = jQuery.noConflict();
var app = app || {};
app.allStatusView = Backbone.View.extend({
tagName: "ul",
render: function() {
this.collection.each(this.addStatus, this);
return this;
},
addStatus: function(status) {
var statusView = new app.singleStatusView({ model: status });
this.$el.append(statusView.render().el);
}
});
我的单一观点：
// singleStatusView.js
var $ = jQuery.noConflict();
var app = app || {};
app.singleStatusView = Backbone.View.extend({
tagName: "li",
className: "service-status",
template: _.template( $("#statusElement").html() ),
render: function() {
var statusTemplate = this.template(this.model.toJSON());
this.$el.html(statusTemplate);
return this;
}
});
这是将“对象”转换为集合所需格式的方法：
app.StatusCollection = Backbone.Collection.extend({
model: app.singleStatus,
url: "/remote/api/status_json",
parse: function (response){
var obj = response.component.objects;
// add the additional properties that won't be in your "models"
// to the collection object directly if you want them
this.status = response.component.status;
this.count = response.component.count;
// convert the "objects" object to an array and return
// the resulting array
return _.map(obj, function (value, key) {
return obj[key];
});
}
});
我将“组件”中的其他属性直接添加到了集合对象中，但这不是必需的-仅当您需要保留这些属性时，它们才存在。最后，您可以对不属于“组件”的其他属性执行相同的操作。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句