Angular ui-路由器解析不工作

Question

我正在尝试在主状态解析函数中加载一个获取服务 JSON 函数，这样我就可以将数据存储到范围变量中。

帐户JSON信息是相关的，因为所有子页面本质上都依赖于该信息。

--

以下代码部分有效。帐户解析功能被成功调用，甚至 $http returns 也是一个承诺（虽然状态 === 0）。问题是当帐户函数解析 state.controller is never being called.

$stateProvider
            .state('app',{
                url: '/',
                views: {
                    'header': {
                        templateUrl: '../views/templates/partials/header.html',
                    },
                    'content': {
                        templateUrl: '../views/templates/partials/content.html' 
                    },
                    'footer': {
                        templateUrl: '../views/templates/partials/footer.html',
                    }
                },
                resolve: {
                    account:  function($timeout, accountFactory){
                        //Comment
                        return $http({method: 'GET', url: '/account.json'});
                     }
                },
                controller: ['$scope', 'account',  function($scope, account){
                    // You can be sure that promiseObj is ready to use!
                    $scope.data = account;
                    console.log('SCOPE!!!!!');
                }],
            })
            .state('app.accessory', {
                url: 'accessory',
                views: {
                    'content@': {
                        templateUrl: '../views/accessory/listing.html',
                        controller: 'accessoryListingCtrl',
                        controllerAs: 'vm'
                    }
                }

            })
    }]);

Answer 1

我不知道为什么控制器没有被调用。但是您可以先确保 resolve 总是 return data.

resolve: {
    account:  function($timeout, accountFactory){
        //Comment
        return $http({method: 'GET', url: '/account.json'})
            .$promise.then(
                function(data) { return data; },
                function(error) { return error; });
    }
}

Answer 2

您的父状态配置不正确。当使用多个命名视图时控制器不属于状态而是属于视图，所以你应该将你的控制器声明移动到特定的视图声明，或者如果你到处都需要它。

看这里：https://github.com/angular-ui/ui-router/wiki/Multiple-Named-Views

$stateProvider
  .state('report',{
    views: {
      'filters': {
        templateUrl: 'report-filters.html',
        controller: function($scope){ ... controller stuff just for filters view ... }
      },
      'tabledata': {
        templateUrl: 'report-table.html',
        controller: function($scope){ ... controller stuff just for tabledata view ... }
      },
      'graph': {
        templateUrl: 'report-graph.html',
        controller: function($scope){ ... controller stuff just for graph view ... }
      },
    }
  })

Angular ui-路由器解析不工作

Angular ui-router resolve not working

angularjs

angular-ui-router