CODEWITHSUNDEEP
angularjstypescript
Aj1
Aj1

Reputation: 973

TypeScript Angular function on service is not defined or undefined

Here is my service.

export module cropyear_services {
//export interface ICropYearService {
//    getFieldYearData(): any;

//}
export class CropYearService {    

    static $inject: string[] = ["$q", "$filter", "$httpBackend", "$http"];
    constructor(private _q: ng.IQService, private _http: ng.IHttpService, private _filter: ng.IFilterService, private _$httpMock: ng.IHttpBackendService) { }

    getFieldYearData = function () {

        let deferred = this._q.defer();
        let uri = endpoints.Endpoints.endpoints.fieldyears;
        this._http.get(uri).then((fieldYearResultData: any) => {
            let fieldYearData = fieldYearResultData.data[0].ResultSet;
            deferred.resolve({ result: fieldYearData });
        }).catch(() => {
            deferred.reject();
        });         

        return deferred.promise;
    }

 }
}

And Here is my controller where I am calling the service method.

/// <reference path="../../../../thirdparty/lodash/lodash.d.ts"/>
/// <reference path="../../../../thirdparty/angular-material/angular-material.d.ts"/>
 /// <reference path="../../../../thirdparty/angular/angular.d.ts"/>
/// <reference path="../../../../thirdparty/angular-ui-router/api/angular-ui-router.d.ts"/>
/// reference path="./cropyear.service.ts"/>
/// reference path= "../../../../common/sharedData/TSModule/sharedData.ts'/>
import service = require('./cropyear.service');
import SharedDataFactory =    require('../../common/sharedData/TSModule/sharedData'); 

export module cropyear_controllers {
export class CropYearController {
    static $inject: string[] = ["$log", "$scope", "cropYearService"];
    constructor(/*private _log: ng.ILogService,*/ public _scope: ng.IScope,   public _cropYearService:  service.cropyear_services.CropYearService
        , public _sharedData: any, public fieldYears: any) {
        this._sharedData = SharedDataFactory.sharedData_factories.SharedData;
    }
    loadYears() {            
        this._cropYearService.getFieldYearData()
            .then((data: any) => {
                this.fieldYears = _.uniq(_.pluck(data.result, 'CropYear'));
            })
            .catch(() => {
                console.log('Error calling farm view  service');
            });
    }
    hangeCropYear(year: number) {
        this._sharedData.selectCropYear(year);
    }
}
}

Vs compiles it with no errors. When I try to rise the loadYears(), i get error in console that Uncaught TypeError: this._cropYearService.getFieldYearData is not a function. Can any one point out where is my mistake?

Upvotes: 0

Views: 2040

Answers (2)

Aj1
Aj1

Reputation: 973

Figured it. That's because of the order of $inject.

Upvotes: 2

basarat
basarat

Reputation: 276229

When I try to rise the loadYears(), i get error in console that Uncaught TypeError: this._cropYearService.getFieldYearData is not a function

The meaning of this in loadYears is driven by the caller. Since you haven't shared how you are calling loadYears I suspect that the fix is a simple change to arrow function: 

loadYears = () => {            
    this._cropYearService.getFieldYearData()
        .then((data: any) => {
            this.fieldYears = _.uniq(_.pluck(data.result, 'CropYear'));
        })
        .catch(() => {
            console.log('Error calling farm view  service');
        });
}

Upvotes: 1

Related Questions