I you really want to stick with using Router.navigate
to benefit from the routing system that Backbone.js provides without having to deal with hashbang bugs when used in a Chrome extension (e.g. routes including a slash being overwritten), you could make Router.navigate
load the url directly, skipping the whole pushState gymnastic.
This is actually pretty easy to accomplish:
Router = Backbone.Router.extend({
navigate: function (url) {
// Override pushstate and load url directly
Backbone.history.loadUrl(url);
},
// Put routes here
routes: { }
});
You can then call Router.navigate(url)
to load a new route without changing history, or even bind the action to every link containing a data-backbone
attribute (e.g. <a href="login" data-backbone>Login</a>
) with an event like this:
$(function(){
// Initialize router
Router = new Router;
Backbone.history.start();
// Bind a[data-backbone] to router
$(document).on('click', 'a[data-backbone]', function(e){
e.preventDefault();
Router.navigate( $(this).attr('href') );
});
});