我有一个显示多个(十几个)内容页面的多语言网站,具有如下漂亮的 url:
example.com <- home for default language (french)
example.com/biographie <- page 1
example.com/en <- home for english language
example.com/en/biography <- page 1 english translation
我想将页面合并在一起并提供完整的 ajax 导航,非常像 Pitchfork做过。最重要的是保留非 JavaScript 客户端(SEO、社交网络等)的页面 View 。
服务器正在提供完整的网页,然后当 Backbone 初始化时,它会预取其他页面并将其注入(inject) DOM 以加快导航速度。当我导航到另一个页面时,我使用 Backbone 内置的 History API 在历史记录中记录新的 URL,并更改我的 View 以显示请求的页面。
var Navigator = Backbone.Router.extend({
routes: {
"*page": "showPage",
},
showPage: function(page) {
this.pages[page].show();
}
}
我遇到的问题是管理 i18n(我的意思是翻译的页面)。如何设置我的路由器来处理该语言?我应该如何处理语言切换?
routes: {
"*page": "showPageFr",
"en/*page": "showPageEn",
},
showPageFr: function(page){
showPage(page, 'fr');
},
showPageEn: function(page){
showPage(page, 'en');
},
showPage: function(page, lang) {
// How should I manage 'lang' parameter here ?
this.pages[page].show();
}
我看过 i18n JS 框架,但我认为我不需要它,因为我想翻译整个页面内容,而不是一些 UI 元素。所有翻译部分都在服务器端进行管理。
最佳答案
感谢 DashK 带领我走上了美好的道路。 解决方案是在检测到英语时更改历史根。
var Router = Backbone.Router.extend({
language: null,
initialize: function(options){
this.language = options.language;
Backbone.history.start({pushState: true, root:'/'+ (this.language ? this.language : '')});
},
routes: {
":chapter(/*subpage)": "go",
"" : "go" // match home route
},
go: function(chapter, subpage) {
}
});
// wait for the document to be ready
$(function(){
var lang;
if($.url().segment(1) === 'en') { lang = 'en'; }
new Router({language: lang});
});
然后,当我在代码中使用 router.navigate("some-chapter")
时,我不必关心语言。
关于javascript - 如何使用 Backbone.js 增强多语言网站导航?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14763985/