3

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;
              }
         }
     }
});

visible は観察可能ではないため、これは機能しないと思います。 isActive は書き込み機能のない計算されたものであるため、どちらも機能しません。ナビゲーション メニューでルートの可視性を動的に変更するにはどうすればよいですか?

4

2 に答える 2

0

もう 1 つの方法は、すべてのルートを使用できるようにすることですが、バインドされた式を使用して、コンテンツまたはログイン ページのいずれかをルートで指定されたコンテナー ビューに構成することです。

リテラル ビュー名を指定する代わりに、compose パラメーターを、ログイン ビューの名前とコンテンツ ビューの名前のどちらかを選択する三項式にバインドします。app.isAuthenticated()制御式は、ユーザーがログインまたはログアウトに成功したときに値を設定する必要があるなどのオブザーバブルになります。

このアプローチは、アプリケーションを通るパスの概念を排除するため、ディープ リンクに直面しても堅牢です。明示的なリダイレクト ロジックがなければ、ユーザーを認証してから、要求されたリソースを表示します。

三項式の代わりに関数を使用して、2 つ以上の可能な状態に拡張できます。これは、ユーザーの許可に従って異なる UI を配信する必要がある場合に便利です。

于 2014-10-20T05:37:15.470 に答える