UI路由器不会解析$ http呼叫

Question

我有一个API，我想解决名称为“泡沫”。这个我想注入控制器 - 但问题是，我已经尝试不同的方法和一切只是说...不确定和一些注射问题... :(

代码：

.state('bubbles', { 
    abstract: false, 
    url: "/bubbles/:bubbleId/feed", 
    controller: 'BubblesController', 
    data: { 
     authorizedRoles: [USER_ROLES.editor] 
    }, 
    resolve: { 
     resolvedBubbleName: function ($http, $stateParams) { 
      var url = 'https://XXXXXXX.net/api/Bubble/11111111-1111-1111-1111-111111111111'; 
      return $http.get(url) 
      .then(function (response) { 
       console.log('response ' + response); 
       return response; 
      }); 
     }, 
     views: { 
      'navigation': { 
       templateUrl: "/raqt/shared/partials/navigation.html" 
      }, 
      'main': { 
       templateUrl: "/raqt/bubbles/partials/bubbles.html" 
       //controller: function ($scope, resolvedBubbleName) { 
       // $scope.resolvedBubbleName = resolvedBubbleName; 
       // // resolvedBubbleName is always undefined, i.e., 
       // // UI router is not injecting it 
       //} 

      } 
     }, 
    } 

}) 

在我控制器我尝试不同的方法，这是我认为应该工作...给出错误注入......从页面

BubblesController.$inject = ['$stateParams', '$state', '$log', '$timeout', '$interval', '$scope', 'BubblesService', 'CONFIG', '$http', 'resolvedBubbleName']; 

function BubblesController($stateParams, $state, $log, $timeout, $interval, $scope, BubblesService, CONFIG, $http, resolvedBubbleName) { 
    $scope.title = 'bubbles-controller'; 
    alert(resolvedBubbleName); 
    $scope.bubbleId = $state.params.bubbleId; 

错误

Error: [$injector:unpr] Unknown provider: resolvedBubbleNameProvider <- resolvedBubbleName <- BubblesController 
http://errors.angularjs.org/1.3.15/$injector/unpr?p0=resolvedBubbleNameProvider%20%3C-%20resolvedBubbleName%20%3C-%20BubblesController 
    at REGEX_STRING_REGEXP (http://localhost:3604/js/lib/angular/angular.js:63:12) 
    at http://localhost:3604/js/lib/angular/angular.js:4015:19 
    at Object.getService [as get] (http://localhost:3604/js/lib/angular/angular.js:4162:39) 
    at http://localhost:3604/js/lib/angular/angular.js:4020:45 
    at getService (http://localhost:3604/js/lib/angular/angular.js:4162:39) 
    at Object.invoke (http://localhost:3604/js/lib/angular/angular.js:4194:13) 
    at $get.extend.instance (http://localhost:3604/js/lib/angular/angular.js:8493:21) 
    at http://localhost:3604/js/lib/angular/angular.js:7739:13 
    at forEach (http://localhost:3604/js/lib/angular/angular.js:331:20) 
    at nodeLinkFn (http://localhost:3604/js/lib/angular/angular.js:7738:11) <div ui-view="main" class="ng-scope"> 

我可以看到，$ HTTP调用是有数据的，我知道控制器效果很好，否则 - 但这决心把我逼疯.. :(

我会关闭几个小时 - 但我会回来的GE这个如果你看到在我的代码我将GE的一些问题回来，并回答！... :)

Answer 1

我会说，你已经错误地嵌套views : {}到resolve : {}。有a working plunker

我刚搬到你定义成正确的位置，它是工作

.state('bubbles', { 
    abstract: false, 
    url: "/bubbles/:bubbleId/feed", 
    //controller: 'BubblesController', 
    data: { 
     authorizedRoles: [{}], //USER_ROLES.editor] 
    }, 
    resolve: { 
     resolvedBubbleName: ['$http', '$stateParams', 
     function($http, $stateParams) { 
      //var url = 'https://XXXXXXX.net/api/Bubble/11111111-1111-1...'; 
      var url = 'someData.json' 
      return $http.get(url) 
      .then(function(response) { 
       console.log('response ' + response); 
       return response.data; 
      }); 
     } 
     ], 
    }, 
    views: { 
     'navigation': { 
     templateUrl: "raqt/shared/partials/navigation.html", 
     controller: 'BubblesController', 
     }, 
     'main': { 
     templateUrl: "raqt/bubbles/partials/bubbles.html", 
     controller: ['$scope', 'resolvedBubbleName', 
      function($scope, resolvedBubbleName) { 
      $scope.resolvedBubbleName = resolvedBubbleName; 
      } 
     ] 
     } 
    }, 
}) 

此外，还有一个非常重要的注意事项：

controller belongs to view - not to state

你可以在这里阅读更多：

• Are there different ways of declaring the controller associated with an Angular UI Router state

检查工作示例here

EXTEND

在情况下，我们调整上面所有的代码，我们提供了这样的错误：

Error: [$injector:unpr] Unknown provider: resolvedBubbleNameProvider <- resolvedBubbleName <- BubblesController

我们是最有可能在一个这些场景：

• 我们在其他地方有我们的状态层次结构重用t它不是由UI-路由器管理 - 他"BubblesController"，同时不到位
• 有resolve : { 'resolvedBubbleName': ... }我们在其他地方​​声明。而且它没有获得所谓的locals（含解析值）

所以，可以肯定的是控制器定义，其中 - 都将开始工作，然后...