ERROR TypeError: Cannot read property 'moreText' of undefined using ngx-translate

[santoshpatro]

I am using ngx-translate for managing the translation functionality for an angular application having ng-version="4.4.7"

I have the following key in translations file:

en.json :
{
  "moreText": "more"
}

es.json :
{
  "moreText": "más"
}

TestService.ts:

import { TranslateService } from "@ngx-translate/core";

@Injectable()
export class TestService {
  public moreText: string;
  constructor(private zone: NgZone, public translateService: TranslateService) {
    this.moreText = translateService.instant("moreText");
  }
}

I am trying to use the moreText in test.model.ts file

test.model.ts:

import { TestService } from "./test.service";
export class TestModel {
  constructor(data: any, private testService?: TestService) {
  }

get parsedCountries(): string {
    const countriesAmount = this.countries.length;

    return (countriesAmount < 4
      ? this.countries
      : this.countries
          .slice(0, 2)
          .concat(`${countriesAmount - 2} ${this.testService.moreText}`)
    ).join(", ");
  }
}

I don't see any compile time errors, but at rumtime when it comes to use moreText in the parsedCountries() I am getting an error: ERROR TypeError: Cannot read property 'moreText' of undefined using ngx-translate

[santoshpatro]

I have created a project with all the details: stackblitz.com/edit/angular-6vlspz . Here I am trying to use the value of MoreText from the moreTextContent() method of test.model.ts file. Any help on this is much appreciated.