Angularjs UI路由器将不会解析$http调用

我有一个api，我想解析“bubble”的名称。这是我想注入控制器的——但问题是，我尝试了不同的方法，都只是说…未定义和一些注入问题…：(

代码：

在我的控制器中，我尝试了不同的方法，我认为这应该是可行的…提供了错误注入

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">

---

错误：[$injector:unpr]未知提供程序：resolvedubblenameprovider我想说的是，您错误地将
视图：{}
嵌套到
解析：{}
中

我刚刚把你的定义移到正确的位置，它正在工作

.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; 
          }
        ]
      }
    },
})

还有一点非常重要：

控制器
属于视图-非状态

您可以在此处阅读更多内容：




检查工作示例

延伸

如果我们按照上述方式调整了所有代码，并且我们收到了以下错误：

错误：[$injector:unpr]未知提供程序：resolvedBubbleNameProvider您好，很抱歉回复太晚。我尝试查看了您的代码并查看了我的代码-您的代码正在工作，但我仍然收到非常奇怪的消息，说明injector是错误的。错误：[$injector:unpr]未知提供者：resolvedBubbleNameProvider我扩展了我的答案，增加了两个可疑的场景。希望这对您有所帮助并对您有效；）好吧-这太尴尬了-我使用grunt和watcher进行文件和缩小。。。。现在我想你知道发生了什么。。。我一直在编辑错误的文件，因为grunt没有正确地查看该文件！今天下午我再回家时，我会给你测试解决方案。。我很肯定这会奏效的！：）希望它会。。祝你成功！角度和用户界面路由器是真正的钻石；）祝你好运
.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; 
          }
        ]
      }
    },
})