如何動態更改Durandal路線的可視性？

我有我的Durandal路線配置如下。如何動態更改Durandal路線的可視性？

var routes = [ 
....... More Routes Here..... 
{ 
    url: 'login', 
    moduleId: 'viewmodels/login', 
    name: 'Log In', 
    visible: true, 
    caption: 'Log In' 
}, { 
    url: 'logout', 
    moduleId: 'viewmodels/logout', 
    name: 'Log Out', 
    visible: false, 
    caption: 'Log Out' 
}, { 
    url: 'register', 
    moduleId: 'viewmodels/register', 
    name: 'Register', 
    visible: false, 
    caption: 'Register' 
}];

一切都在按預期工作。我希望在登錄時能夠在我的導航中激活「註銷路線」，並且我的登錄按鈕變爲不可見。我嘗試了下面的代碼，儘管沒有拋出任何錯誤，但它並沒有改變界面中任何東西的可見性。

var isLoggedIn = ko.observable(false); 
isLoggedIn.subscribe(function (newValue) { 
    var routes = router.allRoutes(); 
    if (newValue == true) { 
     for (var k = 0; k < routes.length; k++) { 
      if (routes[k].url == 'logout') { 
       routes[k].visible = true; 
      } 
      if (routes[k].url == 'login') { 
       routes[k].visible = false; 
      } 
     } 
    } else { 
     for (var i = 0; i < routes.length; i++) { 
      if (routes[i].url == 'logout') { 
       routes[i].visible = false; 
       }   
       if (routes[i].url == 'login') { 
        routes[i].visible = true; 
       } 
     } 
    } 
});

我相信這不起作用，因爲可見的是沒有可觀察到的，isActive是計算沒有寫入能力，因此也不起作用。如何在導航菜單中動態更改路線的可見性？

來源

2013-05-14 PlTaylor

看看Joseph的答案：http://stackoverflow.com/questions/16031226/durandal-js-change-navigation-options-per-area?answertab=active#tab-top。這應該可以幫助你。 – Yogesh

這是我最終做的。

//ajax call to log user in 
.done(function (recievedData) { 
    if (recievedData == true) { 
     router.deactivate(); 
     return router.map(config.routesLoggedIn); 
    } else { 
     router.deactivate(); 
     return router.map(config.routes); 
    } 
}).done(function() { 
    router.activate('frames'); 
    return router.navigateTo('#/frames'); 
});

本質上在我的配置對象中創建了兩個路由配置文件。一個用於登錄，另一個不用。有一個警告。 router.deactivate（）方法是一種非常新的方法，目前還不在NuGet包中。我從Durandal的GitHub存儲庫的主分支複製了新路由器的代碼。關於Durandal User Group上的這個新功能有一些討論。最終出於安全原因，我可能會從我的服務器提供已登錄的路由。但暫時這應該工作得很好。

來源

2013-05-15 19:25:15 PlTaylor

另一種方法是使所有路由可用，但使用綁定表達式將內容或登錄頁面組合到由路由指定的容器視圖中。

不是提供文字視圖名稱，而是將compose參數綁定到在登錄視圖的名稱和內容視圖的名稱之間選擇的三元表達式。控制表達式將是一個可觀察的值，例如app.isAuthenticated()，其值必須在用戶成功登錄或註銷時設置。

這種方法在面對深度鏈接時是健壯的，因爲它消除了通過應用程序的路徑的概念。如果沒有明確的重定向邏輯，它將認證用戶，然後顯示請求的資源。

它可以擴展到超過兩個可能的狀態使用函數而不是三元表達式。根據用戶權限，必須交付不同的用戶界面時，這非常方便。

來源

2014-10-20 05:37:15

如何動態更改Durandal路線的可視性？

回答

相關問題