AngularJS TypeError 不是一个函数

Question

我的服务中有以下代码：

 testApp.service('detailsService',['databaseService', 'loggedService', '$http', function(databaseService, loggedService, $http){

    var details;

    this.getDetails = function(name){

        return $http({
            method : "GET",
            url : name
        }).then(function(response) {
           details= response.data;
           console.log(response.data);
           return response.data;
        });

    };

}]);

我想要做的是在加载页面（视图）时在我的控制器中调用此函数。

 testApp.controller('testController', ['$scope', '$location', 'databaseService','detailsService', '$routeParams', function($scope, $location, databaseService, $routeParams, detailsService){

    $scope.details;

    var selectedDetails = function(name){
             detailsService.getDetails(name).then(function(data){
            $scope.details= data;
        });
    };

    selectedDetails(name);

}]);

我不断收到错误 detailsService.getDetails is not a function。我在另一个控制器中使用 detailsService 中的相同功能，没有任何问题。

有人知道为什么我一直收到这个错误吗？

原文由 Urban 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

该错误是预期的，因为您没有正确注入依赖项，您需要使用正确的顺序。

 testApp.controller('testController', ['$scope',
    '$location',
    'databaseService',
    'detailsService',
    '$routeParams',
    function($scope, $location, databaseService, detailsService, $routeParams ){

代替

testApp.controller('testController', ['$scope',
    '$location',
    'databaseService',
    'detailsService',
    '$routeParams',
    function($scope, $location, databaseService, $routeParams, detailsService){

注意 字符串部分和函数参数都需要 1:1 匹配。

原文由 Satpal 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

我收到此错误是因为我向组件添加了回调方法，但回调并未被使用该组件的所有页面使用：

 <component [myCallbackFn]="fnNameToBindToFn">

组件.ts：

 public onClick() {
    // some code
    this.myCallbackFn();
}

每次未使用时，我都会收到此错误，这实际上是一个 NullPointerException（来自 Java）。因此，在我的网站中 <component> 的其他用途中，我必须在回调之前在组件中添加一个检查以说明：

 if (undefined !== this.myCallbackFn) this.myCallbackFn();

原文由 Scala Enthusiast 发布，翻译遵循 CC BY-SA 4.0 许可协议