0

嗨,我希望能够稍微延迟我的应用程序的启动,这就是我的意思。

这是我的外壳视图:

<div>
<!-- ko compose: { view : header }-->
<!--/ko-->
<!-- ko compose: { view : content }-->
<!--/ko-->

这是我的外壳视图模型:

define(['plugins/router', 'services/dataService' , 'models/appViewModels'],
    function (router,dataService , appViewModels) {

        var vm = {
            header: ko.observable(),
            content: ko.observable(),
            activate: activate
        };

        function activate() {
            setActivePage();
        }


        function setActivePage() {
            $.when(dataService.account.isAuthenticated())
                .done(function(isAuthenticated) {
                    setDefaultDisplayPage(isAuthenticated)
                }).fail(function(data) {
                    alert(data);
                });
        }

        function setDefaultDisplayPage(isAuthenticated) {
            if (isAuthenticated) {
                setHeaderAndContentObservables(appViewModels.header.generalHeader, appViewModels.content.homeContent);
            } else {
                setHeaderAndContentObservables(appViewModels.header.loginHeader, appViewModels.content.loginContent);
            }
        }
}

我使用 observables 而不是我的视图路径的字符串表示的原因是因为在我的 shell 中,我决定是否应该在 login 或 homepage 上发送我的用户。

这很有效,除了从服务器获取 isAuthenticated 属性所需的时间之外,启动屏幕消失并且用户在空白页面上等待直到接收到数据。

现在我可以尝试在 main.js 文件中获取数据并将其缓存,但我认为 main.js 应该只负责应用程序配置。

有没有办法在 shell 实际被绑定并且启动画面消失之前调用服务器以获取数据?

4

1 回答 1

2

我同意 PW Kad 的建议。Durandal 包含 Q.js。我有同样的场景[检查用户是否经过身份验证=>通过返回承诺的 Durandal 路由器从数据库加载用户菜单 => 加载内容] 但是,我在您的代码中看不到路由器。

无论如何,在 activate 方法中,您可以执行以下操作:

  var vm = {
            header: ko.observable(),
            content: ko.observable(),
            isAuthenticated: ko.observable(false),
            activate: activate
        };

function activate() {

            return Authenticate()
                 .then(setDefaultDisplayPage)
                 .fail(failed);
        }
function Authenticate() {
// pass an observable as a parameter to your function 
                dataService.account.isAuthenticated(isAuthenticated);
                return Q.resolve();
                }
       function setDefaultDisplayPage() {        
        if(isAuthenticated()) {
    setHeaderAndContentObservables(appViewModels.header.generalHeader,appViewModels.content.homeContent);
}
        else { setHeaderAndContentObservables(appViewModels.header.loginHeader,appViewModels.content.loginContent);
        }
    }
    function failed(){
// failure code goes here
}

这样,在从服务器获取数据之前,您的视图模型不会被绑定。

于 2014-01-26T23:40:16.113 回答