控制器訪問ui路由器解析

Question

我繼續發現偉大的ui路由器。我現在關注resolve()的功能。我有一個基地$state我從後端解析查詢（）。

$stateProvider 
    .state('baseApp', { 
     url: '/app', 
     abstract: false, 
     templateUrl: 'app/layout/baseApp.html', 
     authenticate: true, 
     resolve: { 
     // Access API Service 
     APIService: 'APIService', 

     // Operators 
     myObjects: function(APIService){ 
      // APIService is a service exposing $resource 
      return APIService.myObjects.query().$promise; 
     } 
     } 
    }) 
    .state('baseApp.state1', { 
     url: '/state1', 
     views: { 
     'workspace': { 
      templateUrl: 'app/state1.html', 
      controller: 'State1Ctrl', 
      controllerAs: 'state1' 
     } 
     }, 
     authenticate: true 
    }) 

我試圖訪問myObjects在我State1Ctrl：

function State1Ctrl(myObjects) { 
    .... 
    console.log(myObjects); 
    .... 
} 

我希望看到myMobject列表打印在控制檯中。可悲的是，這裏是輸出：

undefined 

看來我無法訪問我的控制器中的承諾。你知道爲什麼嗎？

Answer 1

您應該在$resource承諾函函數中獲取數據。

function State1Ctrl(myObjects) { 
    .... 
    cmyObjects.then(function(data){ 
     console.log(data) 
    }); 
} 

Answer 2

這個問題其實很簡單：

UI路由器注射決心值相關聯的狀態控制器。

要讓它進入你的控制器，你應該你的決心移動到子狀態

$stateProvider 
.state('baseApp', { 
    url: '/app', 
    abstract: false, 
    templateUrl: 'app/layout/baseApp.html', 
    authenticate: true 
}) 
.state('baseApp.state1', { 
    url: '/state1', 
    views: { 
    'workspace': { 
    resolve: { 
     // Access API Service 
     APIService: 'APIService', 

     // Operators 
     myObjects: function(APIService){ 
      // APIService is a service exposing $resource 
      return APIService.myObjects.query().$promise; 
     }  
     } 
     templateUrl: 'app/state1.html', 
     controller: 'State1Ctrl', 
     controllerAs: 'state1' 
    } 
    }, 
    authenticate: true 
}) 

編輯：在您的特定情況下，我覺得你想要的是有一個「父」控制器到您的第一個狀態是這樣的：

$stateProvider 
.state('baseApp', { 
    url: '/app', 
    abstract: false, 
    templateUrl: 'app/layout/baseApp.html', 
    authenticate: true, 
    controller: BaseAppCtrl, 
    resolve: { 
    // Access API Service 
    APIService: 'APIService', 

    // Operators 
    myObjects: function(APIService){ 
     // APIService is a service exposing $resource 
     return APIService.myObjects.query().$promise; 
    } 
    } 
}) 
.state('baseApp.state1', { 
    url: '/state1', 
    views: { 
    'workspace': { 
     templateUrl: 'app/state1.html', 
     controller: 'State1Ctrl', 
     controllerAs: 'state1' 
    } 
    }, 
    authenticate: true 
}) 

你只需要將這些參數注入父控制器。您可以訪問您的子$範圍內的父$範圍。

在父控制器：

function BaseAppCtrl($scope, myObjects) { 
    .... 
    $scope.myObjects = myObjects; 
    console.log(myObjects); 
    .... 
} 

function State1Ctrl($scope) { 
    .... 
    console.log($scope.myObjects); 
    .... 
} 

兩者的console.log應該顯示在這種情況下的值。

你可以看到它的工作對this plunker

希望它幫助。