骨幹路由器實例化

Question

我對骨幹網非常陌生我堅持實例化路由器對象，我的項目體系結構具有以下文件路由器爲路由器定義和javascript的視圖定義，我想實例化一個路由器對象裏面點擊視圖類的功能，請原諒，如果這是一件簡單的事情，將不勝感激任何幫助。

//Router java script file 
EC.Router = (function() { 
    'use strict'; 

    var 
    viewHash = {}, 
    EvtCalRouter, startRouter; 

    // Set up the Backbone Router. 
    // Evaluates URL with parameters and maps them to functions contained within the Router. 
    // This enables us to do things like allow users to bookmark search results. 
    // See "http://backbonejs.org/#Router" for more info. 
    EvtCalRouter = Backbone.Router.extend({ 

    // Define the Routes we care about. 
    // See "http://backbonejs.org/#Router-routes" for more info. 
    routes : { 
     ""  : "home",    // User navigated to: "/adtglobal/eventcalendar/" 
     "search" : "searchEvents",  // User navigated to: "/adtglobal/eventcalendar/#search" 
     "create" : "createEvent",  // User navigated to: "/adtglobal/eventcalendar/#create" 
     "view" : "viewEventDetails", // User navigated to: "/adtglobal/eventcalendar/#view" 
     "edit" : "editEvent"   // User navigated to: "/adtglobal/eventcalendar/#edit" 
    }, 

    // Instantiate the Views required to display the Event Calendar Search screen. 
    buildSearchScreen : function() { 

     // Application Title 
     viewHash['appTitle'] = ESPN.apps.ADTG.EC.TitleView.newInstance({ 
     el : document.getElementById('ecSearchPageHeadWrap') 
     }); 

     // Event Search Toolbar 
     viewHash['searchTitle'] = ESPN.apps.ADTG.EC.SearchScreenTitleView.newInstance({ 
     el : document.getElementById('ecSearchTitle') 
     }); 

     viewHash['addEventBtn'] = ESPN.apps.ADTG.EC.CreateBtnView.newInstance({ 
     el : document.getElementById('ecAddEventBtn') 
     }); 

}, 

    // Executes when the user navigates to "/adtglobal/eventcalendar/#search" 
    // In all likelihood, the user had bookmarked a particular search result and is coming back to view the results again. 
    // Check for search parameters. If there aren't any, just display the Search View as normal. 
    // Otherwise, query the API with the supplied search parameters and display the results. 
    searchEvents : function() { 
     alert('Inside Search Events'); 
     }, 

    // Executes when the user navigates to "/adtglobal/eventcalendar/#create" 
    // There probably won't ever be parameters to worry about for 'create'. 
    // Show the Create View. Which may just be the the Details View of the Sporting Event in a Create Mode. 
    createEvent : function() {}, 

    // Executes when the user navigates to "/adtglobal/eventcalendar/#view" 
    // If View Parameters are missing, display an error message. 
    // Otherwise display the details of the Sporting Event as specified by the parameters. 
    viewEventDetails : function() {}, 

    // Executes when the user navigates to "/adtglobal/eventcalendar/#edit" 
    // If Edit Parameters are missing, display an error message. 
    // Otherwise display the View Details View of the Sporting Event in Edit Mode, as specified by the parameters. 
    editEvent : function() {}, 

    // Executes when the user navigates to "/adtglobal/eventcalendar/" 
    // Display the Home View, which in this case is the Search View. 
    home : function() { 
    this.buildSearchScreen(); 
    } 

    }); 

    /** 
    * Kicks off Backbone's router functionality. 
    */ 
    startRouter = function() { 
    new EvtCalRouter(); 
    Backbone.history.start(); 
    }; 

    // Start routing functionality 
    $(document).ready(startRouter); 

    // For any module that needs to know... 
    $(document).ready(function() { 
    $(document).trigger(ESPN.apps.ADTG.EC.events.ecInit); 
    }); 

    //------------------------------------------------------------------------------------------------------------------- 
    // Public API 
    //------------------------------------------------------------------------------------------------------------------- 

    return { 
    getView : function(name) { return viewHash[name] || {}; }, 

    }; 

})(); 

我有搜索，在搜索按鈕，我應該做的router.navigate的點擊一個view.js但我怎麼辦創建一個對象上面的路由器和調用該函數。視圖文件如下，

EC.SubmitBtnView = (function() { 
    'use strict'; 

    var BtnView, applyStyles; 

    /** 
    * Apply CSS to this view's HTML element. 
    * @param {Object} $elmt 
    */ 
    applyStyles = function($elmt) { 
    $elmt.css({ 
     "text-align" : "center", 
     "margin-top" : "5px" 
    }); 
    }; 

    // Create the View 
    // See 'http://backbonejs.org/#View-constructor' for more info 
    BtnView = Backbone.View.extend({ 

    events : { 
     "click button" : "btnClick" 
    }, 

    initialize : function() { 
     this.render(); 
    }, 

    render : function() { 
     this.$el.html(_.template($('#submitBtnTemplate').html())); 
     this.$('button').text(ESPN.getI18nText('ESPN.apps.ADTG.EC.SearchSubmitBtnView.label')); 
     applyStyles(this.$('div')); 
    }, 

    btnClick : function() { 
     window.alert('Search!'); 
    } 
    }); 

    //------------------------------------------------------------------------------------------------------------------- 
    // Public API 
    //------------------------------------------------------------------------------------------------------------------- 

    return { 
    newInstance : function(options) { return new BtnView(options); } 
    }; 

})(); 

Answer 1

只是堅持在startRouter創建的路由器的引用：

myApp.myRouter = new EvtCalRouter() 

，然後在您的視圖呼叫路由器

myApp.myRouter.navigate("myRoute", {trigger: true});