15

我之前在尝试将 $scope 和 $http 注入控制器时问了一个类似的问题，Cannot call method 'jsonp' of undefined in Angular.js controller。现在我试图通过将代码移动到控制器内的函数中来稍微重构该代码。我遇到了类似的问题，似乎无法掌握 Angular 中依赖注入的机制。下面是我的新代码。$scope 和 $http 都是未定义的。我正在尝试做的是在 didSelectLanguage() 触发时发出一个 http 请求，并将结果数据从父控制器分配给 $scope 中的“图像”变量。有人可以告诉我依赖注入在这个例子中应该如何工作吗？

angular.module('myApp.controllers', []).

  controller('ImagesCtrl', ['$scope', '$http', function ($scope, $http) {



        $scope.didSelectLanguage=function($scope, $http) {
            console.log($scope);
            $http.jsonp('http://localhost:3000/image?quantity=1&language='+this.language+'&Flag=&callback=JSON_CALLBACK')
            .success(function(data){
            $scope.image = data;
            });

        }

  }])
4

2 回答 2

21

创建控制器时：

angular.module('myApp.controllers', []).
controller('ImagesCtrl', ['$scope', '$http', function ($scope, $http) {
  // ...
}]);

控制器函数体内的东西自动访问$scope并$http因为闭包。因此，无需为 上的函数指定任何其他内容$scope即可访问这些内容：

angular.module('myApp.controllers', []).
controller('ImagesCtrl', ['$scope', '$http', function ($scope, $http) {

  $scope.didSelectLanguage = function() {
    $http.jsonp('http://localhost:3000/image?quantity=1&language=' + this.language + '&Flag=&callback=JSON_CALLBACK');
      .success(function(data) {
        $scope.$parent.image = data;
      });
  }

}]);

运行时didSelectLanguage，它会看到对 的引用$http，并从函数中伸出到外部函数中以获取引用的值；$scope在成功回调内部也会发生同样的情况。

因此，简而言之，无需将任何参数传递给您的didSelectLanguage函数，在这种情况下也没有任何理由使用$injector.

于 2013-07-04T22:28:21.223 回答
1

在 Michelle Tilley 的评论和文章的帮助下，我解决了如下问题。但是，我将保持问题的开放性，直到其他人回答或直到我理解到足以编写随附的解释为止。

controller('ImagesCtrl', ['$scope', '$http', '$injector', function ($scope, $http, $injector) {

    $scope.didSelectLanguage=function() {

            $http.jsonp('http://localhost:3000/image?quantity=1&language='+this.language+'&Flag=&callback=JSON_CALLBACK')
            .success(function(data){
            $scope.$parent.image = data;
            });

        }

  }])
于 2013-07-04T21:55:38.017 回答