Html 骨干网木偶路由问题

我正在尝试在我的主干网中设置路由。木偶应用程序，我是主干网新手

我有点喜欢

var firstProject= new Marionette.Application();

firstProject.addRegions({
    main   : 'main',
});

//my router
var MyRouter = Backbone.Marionette.AppRouter.extend({
  // "someMethod" must exist at controller.someMethod
  appRoutes: {
     "first" : "someOtherMethod"
  },

  /* standard routes can be mixed with appRoutes/Controllers above */
  routes : {
    "second" : "someOtherMethod"
  },
  someOtherMethod : function(){
      alert('hi')
  }
});


firstProject.on('initialize:after', function(){   
    if(Backbone.history){
        Backbone.history.start();

    } 
});

在我的html中，我有

<a href="#/first" class="btn btn-primary btn-lg" role="button">First product</a>
<a href="#/second" class="btn btn-primary btn-lg" role="button">First product</a>

---

当我单击链接时，我想导航我的页面以加载我的第一个html页面和第二个html页面。我读过这些文件，但它们有些复杂。有人能给我一个提示吗？非常感谢

路由应用程序的最简单形式是使用Approter的属性“routes”，如下所示

var firstProject= new Marionette.Application();

firstProject.addRegions({
    main   : 'main',
});

//my router
var MyRouter = Backbone.Marionette.AppRouter.extend({

  /* standard routes can be mixed with appRoutes/Controllers above */
  routes : {
    "second" : "secondMethodFromThisObject",
    "first" : "firstMethodFromThisObject"
  },
  firstMethodFromThisObject : function(){
      alert('hi');
  },
  secondMethodFromThisObject : function(){
      alert('hi');
  }
});


firstProject.on('initialize:after', function(){   
    if(Backbone.history){
        Backbone.history.start();
    } 
});

var firstProject= new Marionette.Application();

firstProject.addRegions({
    main   : 'main',
});

//my router
var MyRouter = Backbone.Marionette.AppRouter.extend({

  /* standard routes can be mixed with appRoutes/Controllers above */
  appRoutes : {
    "first" : "firstMethodFromController",
    "second" : "secondMethodFromController"
  }
});

var MyController = Marionette.Controller.extend({
    "secondMethodFromController": function() {
        alert('Hi from inside the controller');
    },
    "firstMethodFromController": function() {
        alert('Hi from inside the controller');
    }
});

firstProject.addInitializer(function () {
    // initialize routes with controller
    new MyRouter({ controller: new MyController });
});

firstProject.on('initialize:after', function(){   
    if(Backbone.history){
        Backbone.history.start();
    } 
});

如果您想使用appRoutes属性，就像您的应用程序更大时通常会使用的那样。你最好像下面这样

var firstProject= new Marionette.Application();

firstProject.addRegions({
    main   : 'main',
});

//my router
var MyRouter = Backbone.Marionette.AppRouter.extend({

  /* standard routes can be mixed with appRoutes/Controllers above */
  routes : {
    "second" : "secondMethodFromThisObject",
    "first" : "firstMethodFromThisObject"
  },
  firstMethodFromThisObject : function(){
      alert('hi');
  },
  secondMethodFromThisObject : function(){
      alert('hi');
  }
});


firstProject.on('initialize:after', function(){   
    if(Backbone.history){
        Backbone.history.start();
    } 
});

var firstProject= new Marionette.Application();

firstProject.addRegions({
    main   : 'main',
});

//my router
var MyRouter = Backbone.Marionette.AppRouter.extend({

  /* standard routes can be mixed with appRoutes/Controllers above */
  appRoutes : {
    "first" : "firstMethodFromController",
    "second" : "secondMethodFromController"
  }
});

var MyController = Marionette.Controller.extend({
    "secondMethodFromController": function() {
        alert('Hi from inside the controller');
    },
    "firstMethodFromController": function() {
        alert('Hi from inside the controller');
    }
});

firstProject.addInitializer(function () {
    // initialize routes with controller
    new MyRouter({ controller: new MyController });
});

firstProject.on('initialize:after', function(){   
    if(Backbone.history){
        Backbone.history.start();
    } 
});

---

尝试从

href

中取出/取出。只需使用

#first

和

#second

您确定要将主区域选择器设置为

main

您的意思是

.main

还是

#main

？