迪朗達爾：組成

過程中呈現出「LOADING ...」我可以很容易地顯示加載消息，而激活方法是做它的事，像這樣：迪朗達爾：組成

 <div data-bind="compose:ActiveVm"> 
      <div class="text-center" style="margin : 75px"> 
       <i class="fa fa-spinner fa-spin"></i> 
      </div> 
     </div>

但是，如果我再有更新我的ActiveVm財產不同的viewmodel，飛濺的內容不顯示。我瞭解，啓動內容僅用於顯示「初始」加載，但在從一種視圖模式轉換到另一種視圖模式時，我有什麼選擇來顯示此類消息？

請注意，此成分不參與路由...

更新：相關迪朗達爾這裏的問題可能是有價值的未來用戶：https://github.com/BlueSpire/Durandal/issues/414

來源

2013-12-19 Shaun Rowan

這不禁讓人爲的「你有什麼評論試過嗎？」但考慮到我可以看到本作的未來用戶的利益，我想在我的$ 0.02至扔 -

防濺顯示在屏幕上，直到迪朗達爾加載應用程序並與id="applicationHost"的內容與外殼視圖取代了DIV以及加載的後續視圖。如果您想使其成爲可重複使用的組件，您可以做的一件事就是取出正在加載的視圖Html.Partial，並在您的Durandal項目的app文件夾內創建自己的視圖。

例如，您將創建一個新的HTML視圖中您的應用程序文件夾 -

splashpage.html

<div class="splash"> 
    <div class="message"> 
     My app 
    </div> 
    <i class="icon-spinner icon-2x icon-spin active"></i> 
</div>

，然後從外殼組成它 -

<div data-bind="if: showSplash"> 
    <!-- ko compose: 'splashpage.html' --> 
    <!-- /ko --> 
</div>

並在您的查看模型每當你想展示你會切換觀察的showSplash /隱藏 -

var showSplash = ko.observable(false); 

var shell = { 
    showSplash: showSplash 
}; 
return shell;

而且你可以調用從您激活方法的其他視圖模型像這裏面 -

define(['shell'], function (shell) { 

    function activate() { 
     shell.showSplash(true); 
     // do something 
     shell.showSplash(false); 
    } 

});

來源

2013-12-19 19:00:38

也許我使用術語「閃屏」的是不是最好的選擇。這個特殊的作品只是我應用程序的一小部分。「父」視圖模型不是shell，並且這些父視圖模型中也會有多個視圖模型。無論如何，兒童觀看模型似乎不適合負責這種行爲。 –

同樣的基本方法適用 - 您只是想從其他區域調用它，而不是從子視圖模型調用它。我的代碼旨在成爲僞代碼，以幫助您提供適用於您的應用程序的解決方案。 –

我認爲這是一個合理的解決方案。將顯示/隱藏邏輯抽象爲「基本」視圖模型是什麼？這樣，應用程序邏輯就不必關心這個功能。 –

這聽起來像一個自定義transition可能會有用的場景。當合成機制將節點切換進出DOM時，它可以使用轉換。

此頁面，其他設置下>過渡（大約一半的向下）描述了一個自定義的轉換：http://durandaljs.com/documentation/Using-Composition/

來源

2013-12-19 19:04:19

*激活完成後，轉換是否開始？我需要這個在激活工作時發生。 –

我同意@Joseph Gabriel，這聽起來像是一個自定義轉換的好用例。看一下https://gist.github.com/jstott/6326038，它基於Evan Larsen爲Durandal 1.2開始的CSS3轉換。另外，我可能會去換一個加載指示器，當你換出視圖時激活它。 – RainerAtSpirit

@ShaunRowan - 你是對的。激活完成後開始轉換。我不確定我是否理解行爲背後的原因 - 似乎轉換將在此過程的早期開始 - 而不是頁面完全激活之後。我會再看一看 - 也許有些東西我錯過了。 –

迪朗達爾：組成

回答

相關問題