迪朗达尔：组成

过程中呈现出“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 - 你是对的。激活完成后开始转换。我不确定我是否理解行为背后的原因 - 似乎转换将在此过程的早期开始 - 而不是页面完全激活之后。我会再看一看 - 也许有些东西我错过了。 –

迪朗达尔：组成

回答

相关问题