我试图了解如何在我的 Backbone 模型中处理集合实例的数量。将有一个主模型，该模型由多个集合实例组成。集合本身是一些其他模型的组。
- A型
- 集合 B
- C型
- C型
- 集合 B
- C型
- C型
- C型
- 集合 B
- C型
- 集合 B
might even be empty but will only add more Model C's
- 集合 B
这是非工作代码...
应用程序.js
(function() {
var App = {};
window.App = App;
var template = function(name) {
return Mustache.compile($('#'+name+'-template').html());
};
App.World = Backbone.Model.extend({
initialize: function() {
var this.continent = new Array();
this.continent[0] = new App.Continent(0);
this.continent[1] = new App.Continent(1);
this.continent[2] = new App.Continent(2);
this.continent[3] = new App.Continent(3);
this.continent[4] = new App.Continent(4);
this.continent[5] = new App.Continent(5);
}
});
App.Continent = Backbone.Collection.extend({
initialize: function(id) {
switch (id) {
case 0:
this.id = "Europe";
case 1:
this.id = "Asia";
case 2:
this.id = "Africa";
case 3:
this.id = "Australia";
case 4:
this.id = "South America";
default:
this.id = "North America";
}
}
});
App.Index = Backbone.View.extend({
template: template('index'),
initialize: function() {
this.world = new App.World();
this.world.on('all', this.render, this);
},
render: function() {
this.$el.html(this.template(this));
return this;
},
bigland: function() {
return this.world;
},
});
App.Router = Backbone.Router.extend({
initialize: function(options) {
this.el = options.el
},
routes: {
"": "index"
},
index: function() {
var index = new App.Index();
this.el.empty();
this.el.append(index.render().el);
}
});
App.boot = function(container) {
container = $(container);
var router = new App.Router({el: container})
Backbone.history.start();
}
})()
索引.html
<!DOCTYPE html>
<html>
<head></head>
<body>
<h1>Hello world</h1>
<div id='app'>
Loading...
</div>
<script type="text/x-mustache-template" id="index-template">
<ul>
{{#bigland}}
<li>Hello {{.continent}}</li>
{{/bigland}}
</ul>
</script>
<script src="jquery.js"></script>
<script src="underscore.js"></script>
<script src="backbone.js"></script>
<script src="mustache.js"></script>
<script src="app.js"></script>
<script>$(function() { App.boot($('#app')); });</script>
</body>
</html>
我试图从这个演示中获得的输出
- 你好欧洲
- 你好亚洲
- 你好非洲
- 你好澳大利亚
- 你好南美
- 你好北美
问题：
- 如何使用具有多个集合实例的模型使此代码工作。
- 有没有更好的方法来构建这个模型？我愿意为嵌套模型使用主干插件，但希望看到一些工作代码。
- 下一个级别的实验是使集合 B 的某些实例能够专门化和利用不同的业务规则。关于如何组织这种混乱的任何想法，比如在哪里放置辅助方法？关于该逻辑所在位置的任何最佳实践，我可以将它放在主模型 A、集合 B 内或其他地方吗？