Базовая маршрутизация с двумя свойствами

Я делаю этот тест маршрутизации со свойствами, поиском и регистрацией транспортных средств

мой код

$(function() {

  Router = can.Control({

      "vehicles" : function(){
        console.log("the hash is #!vehicles")
      },
      "vehicles/:registration" : function(data){
        console.log("the hash is #!vehicles/:registration "+data)
      },
      "vehicles/:search" : function(data){
        console.log("the hash is #!vehicles/:search "+data)
      }

    });


    can.route("vehicles");
    can.route("vehicles/:registration");
    can.route("vehicles/:search");

    can.route.ready();

    new Router(document);

});

и тесты

Тест один

can.route.attr("поиск", "121-ТЮ-898")

a {_data: Object, _cid: ".map1", _computedBindings: Object, __bindEvents: Object, _bindings: 2…}
__bindEvents: Object
_bindings: 2
_cid: ".map1"
_computedBindings: Object
_data: Object
route: "vehicles/:search"
search: "121-TYU-898"
__proto__: t.Construct

Это нормально, но нет сообщения ("хэш #!vehicles/:search"+data) в консоли

Тест два

can.route.attr("регистрация", "333-TYU-898")

a {_data: Object, _cid: ".map1", _computedBindings: Object, __bindEvents: Object, _bindings: 2…}
__bindEvents: Object
_bindings: 2
_cid: ".map1"
_computedBindings: Object
_data: Object
registration: "121-TYU-898"
route: "vehicles/:registration"
__proto__: t.Construct

Это нормально, но нет сообщения ("хэш #!vehicles/:registration "+data) в консоли"

Тест третий

can.route.attr("поиск", "444-ТЮ-555")

a {_data: Object, _cid: ".map1", _computedBindings: Object, __bindEvents: Object, _bindings: 2…}
__bindEvents: Object
_bindings: 2
_cid: ".map1"
_computedBindings: Object
_data: Object
registration: "121-TYU-898"
route: "vehicles/:registration"
search: "333-TYU-808"
__proto__: t.Construct

Я не понимаю, для меня я ожидаю этого ответа

a {_data: Object, _cid: ".map1", _computedBindings: Object, __bindEvents: Object, _bindings: 2…}
__bindEvents: Object
_bindings: 2
_cid: ".map1"
_computedBindings: Object
_data: Object
route: "vehicles/:search"
search: "444-TYU-555"
__proto__: t.Construct

Не могли бы вы помочь понять, спасибо

Большое спасибо, Дафф, и я могу сделать это?

слушать, когда страница свойств имеет определенное значение?

пример

$(function() {

  Router = can.Control({

      "route": function(){
        console.log("the hash is empty")
      },
      '{can.route} page=search': function(data){
              console.log("the hash is "+data.page+" with id "+data.id )

      },{can.route} page=registration': function(data){
              console.log("the hash is "+data.page)
      }

    });

    can.route(':page/:id');
    can.route.ready();

    new Router(window);

});

и

can.route.attr({страница: "search", id: "123-jlkj-1231"})

и вывести в консоль

хеш-это поиск с идентификатором 123-jlkj-1231

Я проверял, но это не работает :)

Вы видите, что я хочу сделать?


url-routing canjs
person Phane    schedule 14.01.2014    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Представьте себе заполнители маршрутов CanJS, подобные именам переменных в JavaScript. Что-то вроде

function first(param1) {
}

и

function first(param2) {
}

Такие же, как vehicles/:registration и vehicles/:type, соответствующие одному и тому же маршруту. Что вы, вероятно, хотите сделать, так это:

var Router = can.Control({
  "vehicles route" : function(){
    console.log("the hash is #!vehicles")
  },
  "vehicles/:type route" : function(data){
    console.log(data.type);
  }
});

new Router(document);
can.route.ready();

Как показано в этой скрипте: http://jsfiddle.net/4M58j/

Вы также можете сопоставлять такие маршруты, как "vehicles/search" и "vehicles/registration route" (обратите внимание на отсутствующий :, который используется в качестве переменной palceholder.

person Daff    schedule 15.01.2014
comment
Спасибо, Дафф, я добавил еще один ответ, не могли бы вы мне помочь? слушать, когда страница свойств имеет определенное значение? - person Phane; 16.01.2014
comment
Это был бы почти новый вопрос ;) В любом случае, чтобы это работало, вам нужно включить плагин can.Map.delegate: canjs.com/docs/can.Map.delegate.html - person Daff; 16.01.2014