Angularjs在设置变量中的承诺和设计问题答案

【问题标题】：Angularjs promise and design issue in setting variablesAngularjs在设置变量中的承诺和设计问题
【发布时间】：2013-10-22 17:37:50
【问题描述】：

我已经完成了一个设计，其中我在uaContext 中有一些有用的信息，例如productId 和operatorId。我需要这些信息来显示每个页面的内容。

myApp.service('uaContext', function($cookieStore){
    this.init = function() {
        this.isLogged = new Field();
        this.userName = new CookieField('userName', $cookieStore);

        this.appName = new Field();
        this.subAppName = new Field();

        this.operator = new Field();
        this.operatorList = new FilterField();

        this.product = new Field();
        this.productList = new FilterField();
    };

    this.init();
});

为了确保我掌握了这些信息，我捕获了全局 $routeChangeStart 事件：

myApp.run( function($rootScope, $routeParams, uaViewProvider, uaAuthService, uaContext){
    $rootScope.$on('$routeChangeStart', function (event, next) {
        if (uaContext.isLogged.get() == false && next.loginRequired != false){
            console.log('View requires to be logged in');
            if (uaAuthService.sessionCookieExists() == true){
                console.log('Recover session from Cookie');

                uaAuthService.loadSession().then(function() {
                    uaContext.operator.set(uaContext.operatorList.filter('id', +$routeParams.operatorId));
                    uaContext.productList.set(uaContext.operator.get().products);
                    uaContext.product.set(uaContext.productList.filter('id', +$routeParams.productId));
                });
            } else{
                console.log('User not logged in. Redirect to login.');
                uaViewProvider.redirectToView('login');
            }
        }

    });
});

在这种情况下，当我通过 cookie 恢复会话时，我请求使用 loadSession 承诺重新加载会话。然后我根据url参数定义productId和operatorId。

问题在于，在请求更多信息之前，我需要获取这些参数：

var myApp2 = angular.module('ua.myApp2', []);

myApp2.controller('ua.myApp2Controller',
    function ($scope, $rootScope, $routeParams, uaContext, uaApiInterface) {
        $scope.$on('$routeChangeSuccess', function () {
            uaContext.appName.set('Settings');
            uaContext.subAppName.set('Sims');

        });

        console.log('On route change');

        $scope.$watch(function(){
            watchValue = uaContext.operator.get().id + '-' + uaContext.product.get().id
            return watchValue;
        }, function(){
            uaApiInterface.getSimList(uaContext.operator.get().id,uaContext.product.get().id).then(
                function(objects) {
                    console.log('Then');
                    $scope.simList = objects.data.objects;
                    console.log($scope.simList);
                    console.log(objects.data.objects);

                }
            )
        },true);
    }
);

我发现等待loadSession 承诺结束的唯一解决方案是监视operatorId 和productId。

问题是我必须为我的所有观点定义这款手表。这真的不干，所以我的问题是如何优化它？

【问题讨论】：

据我所知，我们有几个选择：创建指令并在那里实现$watch。对所有视图只使用一个控制器（也就是像片段一样使用视图）
谢谢。难道不能等待promise的结束来完成路由吗？同步调用将是解决方案，但在 Angularjs 中似乎不可用...

标签： angularjs promise

【解决方案1】：

我找到的最佳解决方案是把这段代码：

uaAuthService.loadSession().then(function() {
    uaContext.operator.set(uaContext.operatorList.filter('id', +$routeParams.operatorId));
    uaContext.productList.set(uaContext.operator.get().products);
    uaContext.product.set(uaContext.productList.filter('id', +$routeParams.productId));
})

在上下文服务中。

那么在每个视图中，入口点是：

uaContext.getSession().then(...

如果您有任何意见或建议。

【讨论】：