2014-03-05 14 views
1

這是我的shell.html,它定義了一個導航條,幾乎從導槽中取出。在shell.js中不能要求('durandal/app')

<div> 
    <div class="navbar navbar-fixed-top"> 
    <div class="navbar-inner"> 
     <ul class="nav" data-bind="foreach: router.navigationModel"> 
     <li data-bind="css: { active: isActive }"> 

      <a data-bind="attr: { href: hash }"><span><i data-bind="attr: { class: glyph }"></i> <span data-bind="text: title"></span></span></a> 
     </li> 
     </ul> 
     <span class="nav"> 
     Welcome <span data-bind="text: app.user.name()"></span> 
     </span> 
     <div class="loader pull-right" data-bind="css: { active: router.isNavigating }"> 
     <i class="icon-spinner icon-2x icon-spin"></i> 
     </div> 
    </div> 
    </div> 
    <div class="container-fluid page-host" data-bind="router: { transition:'entrance' }"></div> 
</div> 

這是問題的一部分:

<span data-bind="text: app.user.name()"></span> 

user是我添加到app它的創建之後的屬性。它由視圖模型更新以便登錄和註銷。

爲了讓該綁定工作,我需要將該對象帶入視圖模型的範圍。通常我會這樣做:var app = require('durandal/app');。在大多數視圖模型中,這是沒有問題的。但是,當我在shell.js中執行時,視圖管理被嚴重搞砸了。

所有我想要做的就是魚了一些應用程序狀態指示用戶當前是否已登錄。

有兩種可能的解決方案

  • 獲取應用到範圍莫名其妙
  • 以shell.js中的某種其他方式管理應用程序狀態

我確信這對老手來說是微不足道的;我等待着你的智慧。搜索谷歌並不好,因爲「應用程序」是一個過於廣泛的搜索術語。


我通過將用戶粘貼到文檔而不是應用程序來避免這個問題,但這很可怕。我非常樂意以正確的方式來做到這一點。

有趣的是,HTML5瀏覽器定義了sessionStorage正是我污染document的目的。如果你這樣做在你的啓動代碼

if (typeof(document.sessionStorage) == undefined) document.sessionStorage = {}; 

,那麼你可以假設它存在於你的應用程序的其餘部分。 在瀏覽器支持上,我們不能計數,但不難檢查,並在必要時進行創建。如果你查看sessionStorage,你會看到一個警告,即在下一頁加載時內容會丟失,但是在SPA中根本不重要。

回答

0

我們在Durandal應用程序中做的是創建一個獨立的靜態模塊config,其中包含一個名爲userName的可觀察屬性。

在您的模塊的頂部(在shell.js文件,在這種情況下),把下面的:

define([ 
     'durandal/system', 
     'durandal/activator', 
     'plugins/router', 
     'durandal/app', 
     ... 
     'config' 
    ], 
    function(system, activator, router, app,..., config) { 
    } 
); 

config模塊應該是靜態的,這意味着它應該返回對象文本,不是構造函數。

config模塊可能會是這個樣子(梗概):

define('config', ['knockout'], 
    function(ko) { 
     var userName = ko.observable(''); 

     return { 
      userName: userName 
     }; 
    } 
);