TypeError：通过angular js调用API时服务不是函数

Question

每当我运行由angularjs 1.4.3实现的应用程序时。

BannerService.js

app.service('BannerService',function ($http) {

    this.save = function saveBanner(banner) {
        return $http({
              method: 'POST',
                url: 'http://localhost:8081/api/banners'
            });
    }

});

BannerController.js

app.controller('BannerAddCtrl', ['$scope','$log','BannerService',
    function ($scope,$log, BannerService) {
        $scope.save = function() {
            BannerService.saveBanner(myBanner)
                .success(function (result) {
                    $log.debug('RESULT', result);
                }, function (reason) {
                    $log.debug('REASON', reason);
                });
        }

}]）;

还有index.html

 <div class="modal-footer">
    <button type="button" class="btn btn-primary btn-block" ng-click="save()">Save Banner</button>

  </div>

它引发如下异常：

TypeError: BannerService.saveBanner is not a function
at ChildScope.$scope.save (bannerControllers.js:64)
at fn (eval at compile (angular.js:13145), <anonymous>:4:203)
at callback (angular.js:23298)
at ChildScope.$eval (angular.js:15846)
at ChildScope.$apply (angular.js:15945)
at HTMLButtonElement.<anonymous> (angular.js:23303)
at HTMLButtonElement.dispatch (jquery.js:4435)
at HTMLButtonElement.elemData.handle (jquery.js:4121)

有人可以帮助我为什么我得到错误。非常感谢您的时间。

Answer 1

查看错误消息：

BannerService.saveBanner is not a function

基本上，您的应用正在寻找saveBanner分配给您的服务的属性。但是目前您尚未声明此类属性。相反，您的服务包含一个名为的属性save，该属性定义了一个函数（称为saveBanner）。

AngularJS不在乎分配给属性的命名函数。因此，您必须调整属性名称本身。因此，您的服务的功能/属性应如下所示。

this.saveBanner = function () { ... }