Question

我有新的打字稿，我创建了一个控制器，我需要在我的控制器中注入服务，以便我可以使用它的方法。但是我无法使用服务函数及其抛出错误。

错误

TypeError: _this.marketingService.getAllActiveItems is not a function
    at ExportController.getRealCustomerInfo (exportCtrl.js:20)
    at $parseFunctionCall (angular-1.3.js:12475)
    at callback (angular-1.3.js:21703)
    at ChildScope.$eval (angular-1.3.js:14571)
    at ChildScope.$apply (angular-1.3.js:14670)
    at HTMLInputElement.<anonymous> (angular-1.3.js:21708)
    at HTMLInputElement.dispatch (jquery.min.js:14)
    at HTMLInputElement.a.handle (jquery.min.js:14)

控制器

module Marketing.GetRealExportCtrl {

    import IStateParamsService = ng.ui.IStateParamsService;
    import IFlashService = Flash.Services.IFlashService;

    class ExportController {

        listFilters: any;
        fileterExport: any;
        currentValue: string;
        filterValueSelected: string;
        listNumber: number;
        reports: ICustomerInfo[];

        static $inject = ['$stateParams', 'marketingService', '$scope'];

        constructor(private marketingService: IMarketingService) {

            this.listFilters = [
                {
                    name: 'All',
                    listNumber: 1
                },
                {
                    name: 'All PCs',
                    listNumber: 2
                },
                {
                    name: 'All BPs',
                    listNumber: 3
                }];

            this.fileterExport = this.listFilters[0];
            this.listNumber = this.listFilters[0];
        }

        changeFilter = (): void => {
            this.listNumber = this.fileterExport.listNumber;
        }

        getRealCustomerInfo = () => {
            this.marketingService.getRealCustomerInfo(this.listNumber)
                .then((reports: ICustomerInfo[]) => {
                    this.reports = reports;
                }, function (err) {
                    var e = err;
                  console.log(e);
               });

        }
    }

    angular
        .module('Marketing')
        .controller('ExportController', ExportController);
}

我的营销服务

module Marketing.MarketingService {
    import IAjaxService = Common.IAjaxService;
    import AjaxServiceOptions = Common.ajaxService.AjaxServiceOptions;
    import IAjaxResponse = Common.IAjaxResponse;


    class MarketingService implements IMarketingService {
        constructor(
            private ajaxService: IAjaxService,
            private $translate: ng.translate.ITranslateService,
            private $q: ng.IQService) {
            this.$q = $q;
        }
        getRealCustomerInfo = (listNumber: number): ng.IPromise<ICustomerInfo[]> => {
            return this.ajaxService.makeAdminCall('marketingApi', 'getRealCustomerInfo', new AjaxServiceOptions({
                cache: false,
                defaultErrorMessage: 'Loading Customers failed'
            })).then((result: IAjaxResponse) => {
                if (result.data.isSuccessful)
                    return result.data.data;
            });
        }
    }

    service.$inject = ['ajaxService', '$translate', '$q'];

    function service(ajaxService, $translate, $q) {
        return new MarketingService(ajaxService, $translate, $q);
    }

    angular
        .module('Marketing')
        .service('marketingService', service);
}

接口

declare module Marketing {
    export interface ICustomerInfo {
        CustomerID: number;
        CustomerName: string;
        Phone: string;
        Phone2: string;
        MobilePhone: string;
        Email: string;
        MainAddress1: string;
        CustomerTypeID: number;
        CustomerTypeDescription: string;
        SponsorID: number;
        SponsorName: string;
        EnrollerID: number;
        EnrollerName: string;
        PriceTypeID: number;
        PriceTypeDescription: string
    }
    export interface IMarketingService {

        getRealCustomerInfo: (listNumber: number) => ng.IPromise<ICustomerInfo[]>;
    }
}

对我来说似乎无法在控制器中找到this.marketingService.getRealCustomerInfo(this.listNumber)功能。我现在被困住了几天，仍然不知道为什么会这样。请提前帮助，谢谢。

Answer 1

我认为您的错误在于ExportController中的依赖注入。

您使用

static $inject = ['$stateParams', 'marketingService', '$scope'];

但你的构造函数是

constructor(private marketingService: IMarketingService) { ... }

在这里，您的变量marketingService获取第一个依赖项$stateParams的值（它不包含您要调用的函数）。

您可以通过删除$inject语句中未使用的依赖项或根据您的注入完成构造函数来解决此问题。

友情提示：

在MarketingService，

constructor(
    private ajaxService: IAjaxService,
    private $translate: ng.translate.ITranslateService,
    private $q: ng.IQService) {
    this.$q = $q;
}

您不需要this.$q = $q;。只要为构造函数参数指定可见性（访问修饰符），它就会自动绑定到您的类（更多here）。

无法在控制器中注入打字稿中的服务

1 个答案: