如何在CanJS中實現路由器

我正在接受https://github.com/thinkadoo/Projects應用程序的幫助。我在這個幫助下創建了一個類似的應用程序。我的應用程序正在使用d3圖表，而不是使用此圖表。我的應用程序初始化路由器作爲如何在CanJS中實現路由器

var patientStatus = new PatientStatus('#application', {'credentials':Credentials,'secret':Secret});

現在，如果我要實現路由器則應該做哪些改變？這是我的兩個實現的JSFiddle。第一個工作。但後來在我初始化路由器的部分似乎沒有工作。 http://jsfiddle.net/sweety1112/YMAjm/

有人可以幫助我。

來源

2013-04-02 Shraddha Shravagi

這裏是一個updated Fiddle，顯示路由的工作原理：

var Router = can.Control({ 
    defaults: {} 
    }, { 
    init: function() { 
     // this.element.html(can.view('#index', {})); 
    }, 

    ':type/:id route': function(data) { 
     console.log('Type:', data.type); 
     console.log('Id:', data.id); 
    } 
    }); 

    can.route.ready(false); 
    new Router('#content'); 
    can.route.ready(true);

基本上，你做的是初始化你指定的佔位符，並告訴這應該由route處理器可以處理的控制器。現在，如果您轉到類似#!test/23的URL，處理程序的數據將包含type和id屬性。

來源

2013-04-02 13:56:24 Daff

嘿達夫非常感謝。這是工作。我按照你的建議實現了你的，但現在我的問題只是第一個控制器被調用，其餘的路由直接指向同一個控制器。我有許多路線，如項目，狀態，細節等......運行小提琴中提到的代碼後，每個鏈接都顯示項目視圖。這裏是jsfiddle：http://jsfiddle.net/sweety1112/YMAjm/1/。我的代碼中有任何錯誤嗎？ –

我的URL如下1.MyProjectHub/index.html＃！項目，2./MyProjectHub/index.html#!status，3./MyProjectHub/index.html#!detail –

你不需要'：' 。這表明一個變量。如果你想匹配實際的路由，只需將它編寫爲'projects route'，它將與'＃！projects'完全匹配。 – Daff

如何在CanJS中實現路由器

回答

相關問題