即使状态正确，ui-views 也不会被渲染

Question

this 可能重复。我正在使用 Angular 构建一个应用程序。我正在使用 ui 路由器来渲染多个视图。我的问题是当我启动应用程序时，视图没有被渲染。我的路由器是，

app.config(['$stateProvider', '$urlRouterProvider',
    function($stateProvider, $urlRouterProvider) {
    //$urlRouterProvider.otherwise('/');
        $stateProvider
            .state('home', {
                url: '/home',
                views: {        
                    'indexlist': {      
                         templateUrl: 'partials/list',
                        controller:'ListController',
                        controllerAs:'ctrl',    
                       resolve: {
                            users: function ($q, ListService) {
                                console.log('Load all indexlist');
                                var deferred = $q.defer();
                                ListService.loadAllUsers().then(deferred.resolve, deferred.resolve);
                                return deferred.promise;
                            }
                        }
                    },      
                'sidemenu': {       
                    templateUrl: 'partials/sidemenu',
                    controller:'HomeController',
                    controllerAs:'ctrl',    
                   resolve: {
                        users: function ($q, HomeService) {
                            console.log('Load all values');
                            var deferred = $q.defer();
                            HomeService.loadAllLists().then(deferred.resolve, deferred.resolve);
                            return deferred.promise;
                        }
                    }
                }       
              }
            });

而 index.html 是，

<!DOCTYPE html>

<html lang="en" ng-app="myApp">
    <head>
        <title>${title}</title>
        <link href="css/bootstrap.css" rel="stylesheet"/>
        <link href="css/app.css" rel="stylesheet"/>
        <link href="css/sidebar.css" rel="stylesheet"/>
        <script src="js/lib/jquery-3.2.1.min.js"></script>
        <script src="js/lib/bootstrap.min.js"></script>
        <script src="js/lib/angular.min.js" ></script>
        <script src="js/lib/angular-ui-router.min.js" ></script>
        <script src="js/lib/localforage.min.js" ></script>
        <script src="js/lib/ngStorage.min.js"></script>
        <script src="js/app/app.js"></script>
        <script src="js/app/ListService.js"></script>
        <script src="js/app/ListController.js"></script>
        <script src="js/app/HomeService.js"></script>
        <script src="js/app/HomeController.js"></script>
    </head>
    <body>

        <div ui-view="sidemenu"></div>  
        <div ui-view="indexlist"></div> 
    </body>
</html>

但是当我不使用多个视图并在 index.html 中提供空白 ui-view 时，它会呈现视图，

$stateProvider
            .state('home', {
                url: '/home',
                templateUrl: 'partials/sidemenu',
                controller:'HomeController',
                controllerAs:'ctrl',
                resolve: {
                    users: function ($q, ListService) {
                        console.log('Load all lists');
                        var deferred = $q.defer();
                        ListService.loadAllUsers().then(deferred.resolve, deferred.resolve);
                        return deferred.promise;
                    }
                }
            });

谁能建议我是否遗漏了什么或做错了什么？

Answer 1

你在解决部分做错了，下面是更正的版本

resolve: {
           users: function ($q, ListService) {
                  console.log('Load all lists');
                  var deferred = $q.defer();
                  ListService.loadAllUsers().then(function(response){
                        deferred.resolve(true)
                  });
                 return deferred.promise;
            }
     }

在对应的控制器中注入users。