Вы определенно можете попробовать другой шаблон, но я не уверен, что это поможет. Несколько страниц можно получить разными способами.
Хороший справочный пример для Backbone Boilerplate: http://githubviewer.org/. Я выпустил все это как открытый исходный код, и вы можете посмотреть, как туда добавляются основные страницы.
Возможно, вы захотите проявить творческий подход и создать модель страницы, которая обрабатывает страницу, на которой вы находитесь, и внутри каждого маршрута, устанавливает новый заголовок страницы и какие макеты использовать.
Очень простая демонстрационная реализация внутри app/router.js
может выглядеть примерно так:
define([
// Application.
"app",
// Create modules to break out Views used in your pages. An example here
// might be auth.
"modules/auth"
],
function(app, Auth) {
// Make something more applicable to your needs.
var DefaultPageView = Backbone.View.extend({
template: _.template("No page content")
});
// Create a Model to represent and facilitate Page transitions.
var Page = Backbone.Model.extend({
defaults: function() {
return {
// Default title to use.
title: "Unset Page",
// The default View could be a no content found page or something?
view: new DefaultPageView();
};
},
setTitle: function() {
document.title = this.escape("title");
},
setView: function() {
this.layout.setView(".content", this.get("view")).render();
},
initialize: function() {
// Create a layout. For this example there is an element with a
// `content` class that all page Views are inserted into.
this.layout = app.useLayout("my-layout").render();
// Wait for title and view changes and update automatically.
this.on({
"change:title": this.setTitle,
"change:view": this.setView
}, this);
// Set the initial title.
this.setTitle();
// Set the initial default View.
this.setView();
}
});
// Defining the application router, you can attach sub routers here.
var Router = Backbone.Router.extend({
routes: {
"": "index"
},
index: function() {
// Set the login page as the default for example...
this.page.set({
title: "My Login Screen!",
// Put the login page into the layout.
view: new Auth.Views.Login()
});
},
initialize: function() {
// Create a blank new Page.
this.page = new Page();
}
});
return Router;
});
Как видите, это самоуверенный способ создания «страниц», и я уверен, что у других есть лучшие реализации. В Matchbox у меня есть очень надежная модель страницы, которая выполняет «хлебные крошки» и определяет, какие навигационные кнопки выделить, в зависимости от состояния. Вы также можете создавать маршрутизаторы внутри своих модулей, чтобы инкапсулировать функциональность и предоставлять модель страницы в объекте приложения, чтобы она была доступна во всем приложении.
Надеюсь это поможет!
person
tbranyen
schedule
17.02.2013