Маршрутизация BackboneJS

Индексная страница моего приложения находится по адресу http://cms/admin (я на локальном хосте). На главной странице есть только один элемент a:

<a href="/admin/test">deneme</a>

Когда я нажимаю на ссылку, она переходит на /cms/admin/test

Я хочу использовать механизм маршрутизации BackboneJS для преобразования моего приложения в приложение, поддерживающее ajax, но я не могу этого сделать до сих пор. Вот мой JS-код:

$(function() {
    var AppRouter = Backbone.Router.extend({
        routes: {
            "test": "defaultRoute"
        },

        defaultRoute: function() {
            console.log('its here');
        }
    });

    var appRouter = new AppRouter();

    Backbone.history.start({
        pushState: true,
        slient: true,
        root: '/admin/'
    });
});

Когда я запускаю страницу и нажимаю на ссылку, она ничего не записывает в консоль, и браузер переходит по ссылке. После загрузки страницы выводится сообщение «здесь».

Я уже пробовал без корневого параметра, "/admin/test" вместо "test". я пробовал каждую комбинацию: "тест", "/тест", "тест/", "/админ/тест", "админ/тест" и т. д..

Спасибо.


javascript backbone.js backbone-routing
person cnkt    schedule 20.08.2012    source источник

Ответы (2)


arrow_upward
3
arrow_downward

Вы должны переопределить поведение ссылки по умолчанию.

Вы должны перемещаться между страницами, явно вызывая appRouter.navigate("test", {trigger: true});. Поэтому попробуйте зафиксировать событие клика по вашей ссылке в View.events. , предотвратить поведение ссылки по умолчанию и вызвать appRouter.navigate()

Обновлять

Также вы можете сделать это в пакетном режиме:

$("a.bb_link").each( function( index, link ){
  $(link).click( function( event ){
    event.preventDefault();
    appRouter.navigate( $(this).attr( "href" ), {trigger: true} );
  });
});​

Каждая ссылка с классом bb_link будет использовать Backbone.Router.

person fguillen    schedule 20.08.2012
comment
Также есть хороший пример этого в backbone-boilerplate Тима Брайена с использованием атрибута data-bypass: github.com/tbranyen/backbone-boilerplate/blob/master/app/ - person Chris Salzberg; 21.08.2012

arrow_upward
1
arrow_downward

Попробуйте установить тег привязки следующим образом:

<a href="#admin/test">deneme</a>

Обратите внимание на решетку (#)

person Greg Ross    schedule 20.08.2012