TypeScript Angular function on service is not defined or undefined

Question

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?

getFieldYearData = function (), should be getFieldYearData: function () — Fals
– Fals, Commented Oct 5, 2015 at 22:12

Aj1 · Accepted Answer · 2015-10-06 14:05:30Z

2

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

answered Oct 6, 2015 at 14:05

Aj1

9732 gold badges16 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

basarat · Accepted Answer · 2015-10-05 23:27:25Z

1

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');
        });
}

answered Oct 5, 2015 at 23:27

basarat

278k60 gold badges475 silver badges528 bronze badges

Collectives™ on Stack Overflow

TypeScript Angular function on service is not defined or undefined

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related