2016-11-11 2 views
0

Ниже приведена конфигурация моего маршрутизатора на моем весеннем mvc.Сопоставление URL-параметров на маршрутизаторе

Мой вопрос заключается в том, как сопоставить параметр с URL-адресом маршрутизатора, поэтому, когда кто-то переходит к URL-адресу посредством вставки или обновления, он будет отображать точную страницу.

Пример URL: http://localhost:8080/techtalks/#/viewMore/12345

publicRouter.js

define(['jquery', 'underscore', 'backbone', 
    'views/publicModule/viewMoreView', 
], function($, _, Backbone, 
    ViewMoreView 
) { 

    var AppRouter = Backbone.Router.extend({ 
     routes: { 
      // Define some URL routes 
      'viewMore': 'viewMoreView', 
      // Default 
      '*actions': 'defaultAction' 
     } 
    }); 
    var initialize = function() { 
     var app_router = new AppRouter; 
     app_router.on('route:viewMoreView', function() { 
      // Call render on the module we loaded in via the dependency array 
      ViewMoreView.render(); 
     }); 
     Backbone.history.start(); 
    }; 
    return { 
     initialize: initialize 
    }; 
}); 

вид Backbone

define(['jquery', 'underscore', 'backbone', 
    'text!../../../viewMore.html' 
], function($, _, Backbone, adminHomeTemplate) { 
    var ViewMoreView = Backbone.View.extend({ 
     publicArticleTbl: null, 
     el: $("#publicPanel"), 
     render: function() { 
      var data = {}; 
      publicArticleTbl = null; 
      // template 
      var compiledTemplateAdminHome = _.template(
       adminHomeTemplate, data); 
      // append the item to the view's target 
      this.$el.html(compiledTemplateAdminHome); 
     }, 
     // Event Handlers 
     events: { 

     }, 
    }); 
    return new ViewMoreView; 
}); 

ответ

1

Использование обратного вызова напрямую, нет необходимости использовать маршрутизатор события.

Также уловить параметр id с URL.

var AppRouter = Backbone.Router.extend({ 
    routes : { 
     // the order the routes are defined is important, any route defined 
     // later takes precedence on previous routes. 

     // Default 
     '*actions' : 'defaultAction' 
     // Define some URL routes 
     'viewMore/:id':'viewMoreView', 
    }, 

    viewMoreView: function(id){ 
     var view = new ViewMoreView({ 
      el: $("#publicPanel"), 
      id: id 
     }); 
     view.render(); 
    } 
}); 
var initialize = function() { 
    var app_router = new AppRouter(); 
    Backbone.history.start(); 
}; 

Тогда вид:

var ViewMoreView = Backbone.View.extend({ 
    // compile the template once 
    template: _.template(adminHomeTemplate), 

    initialize: function(options) { 
     // make a copy of the options 
     this.options = _.extend({ 
      /* default options goes here if any */ 
     }, options); 

     console.log("id:", this.options.id); 
    }, 
    render: function() { 
     var data = {}; 

     // use the compiled template function here 
     this.$el.html(this.template(data)); 
     return this; 
    }, 
}); 

Магистраль работает со стандартными ссылками, нет необходимости иметь модные вещи для вызова маршрута.

'<a href="#/viewMore/' + item['id'] + '" >Read more</a>' 

При создании модуля, как правило, вы возвращаете конструктор вместо экземпляра. Это помогает при повторном использовании одного вида вида. Верните экземпляр, когда модуль является глобальной службой.

+0

Почему вы любите магистраль emile – Mahi

+0

Как я могу получить 'id' в представлении. – boycod3

+0

@ boycod3 Я обновил ответ с видом –