TypeCript에서 컨트롤러에 서비스를 삽입 할 수 없습니다

Question

typescript가 새로 생겼습니다. 컨트롤러를 만들었으므로 컨트롤러에서 서비스를 주입해야만 해당 메서드를 사용할 수 있습니다.하지만 서비스 기능을 사용할 수는 없습니다. 및 던지는 오류.

오류

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']; 

를 사용하지만 생성자는 변수 marketingService는 (통화 할 기능을 포함하지 않음) 최초의 의존성 $stateParams의 값을 취하고, 여기에

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

입니다.

$inject 문에서 사용되지 않는 종속성을 제거하거나 삽입에 따라 생성자를 완료하여이 문제를 해결할 수 있습니다.

친절한 팁 :

MarketingService에서,

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

당신은 this.$q = $q; 필요하지 않습니다. 생성자 매개 변수에 가시성 (액세스 한정자)을 지정하면 클래스에 자동으로 바인딩됩니다 (more here).