$http 不是 link 指令函数中的函数

Question

我是 angular js 的新手，正在尝试使用指令。我想在指令的 link 函数中使用 $http 。下面是我的代码

MyApp.directive('appItem', ['$http',function() { 
  return { 
    restrict: 'E', 
    scope: { 
      transaction: '=' 
    }, 
    templateUrl: 'js/directives/appItem.html' ,

    link: function($scope, $http, element, attrs) {
            $scope.process = function(trId) {
               $http({
                    method: 'PATCH',
                    url: 'http://myapp.domain.local/api/v1/items/'+trId+'.json'
                }).
               then(function successCallback(response) {
                console.log(response);
               });
            }
        }

  }
}]);

但它给我错误：

$http is not a function

Answer 1

MyApp.directive('appItem', ['$http',function($http) { 
  return { 
    restrict: 'E', 
    scope: { 
      transaction: '=' 
    }, 
    templateUrl: 'js/directives/appItem.html' ,

    link: function(scope,element, attrs) {
            scope.process = function(trId) {
               $http({
                    method: 'PATCH',
                    url: 'http://myapp.domain.local/api/v1/items/'+trId+'.json'
                }).
               then(function successCallback(response) {
                console.log(response);
               });
            }
        }

  }
}]);

Answer 2

这是因为link函数没有作为指令函数依赖注入。

Link 函数按此特定顺序被赋予作用域对象、jQLite (jQuery) 包装元素、属性对象和可选的控制器对象。

另一方面，指令函数注入了依赖项，因此将 $http 放在那里将使您的代码按预期工作。

$http 不是 link 指令函数中的函数

$http is not a function in link functions of directive

javascript

angularjs

angularjs-directive

angular-http