Ng-select: [QUESTION] searchFn with TranslationPipe or access to TranslationService

[Kirbylix]

HTML:

<ng-select class="custom" [items]=dataList
             [bindLabel]=viewField
             [bindValue]=valueField
             [placeholder]="placeholder ? (placeholder | translate) : placeholder"
             [multiple]="isMultiSelect"
             [hideSelected]="true"
             [closeOnSelect]="!isMultiSelect"
             [compareWith]="compareWithId"
             [searchable]="isSearchable"
             [clearSearchOnAdd]="isSearchable"
             [disabled]="isDisabled"
             [loading]="loading"
             [required]="required"
             [searchFn]="transSearchFn"
             [(ngModel)]="model">
    <ng-template ng-label-tmp let-item="item" let-label="label" *ngIf="!isMultiSelect">
      <i *ngIf="iconField" class="{{(item[iconField]|lowercase)}} flag"></i>
      {{viewField ? (item[viewField]|translate) : item|translate}}
    </ng-template>
    <ng-template ng-label-tmp let-item="item" let-clear="clear" *ngIf="isMultiSelect">
      <span class="ng-value-label">
        <i *ngIf="iconField" class="{{(item[iconField]|lowercase)}} flag"></i>
        {{viewField ? (item[viewField]|translate) : (item|translate)}}
      </span>
      <span class="ng-value-icon right" (click)="clear(item)" aria-hidden="true">×</span>
    </ng-template>
    <ng-template ng-option-tmp let-item="item" let-index="index" let-search="searchTerm">
      <i *ngIf="iconField" class="{{item[iconField]|lowercase}} flag"></i>
      <b [ngOptionHighlight]="search">{{viewField ? (item[viewField]|translate) : item|translate}}</b>
      <br *ngIf="postfixProperty">
      <small *ngIf="postfixProperty">{{postfixProperty ? ((item[postfixProperty]|lowercase)|translate) : ''}}</small>
    </ng-template>
  </ng-select>

TypeScript (starts with Line 114):

transSearchFn(term: string, item: any) {
    term = term.toLocaleLowerCase();
    return this.translateService.get(item[this.viewField])['value'].toLocaleLowerCase().indexOf(term) > -1;
  }

Expected behaviour

The function has access to the TranslationService.
Or how can i search the item with the translated bindValue ?

Actual behaviour

ERROR TypeError: Cannot read property 'translateService' of undefined
    at push../src/app/xxxx/xxxx/select.component.ts.SelectComponent.transSearchFn (select.component.ts:116)
    at _loop_1 (ng-select.js:1330)
    at ItemsList.push../node_modules/@ng-select/ng-select/fesm5/ng-select.js.ItemsList.filter (ng-select.js:1356)
    at NgSelectComponent.push../node_modules/@ng-select/ng-select/fesm5/ng-select.js.NgSelectComponent.filter (ng-select.js:3049)

More Info

ng-select version: 2.12.0
browser: Chrome 70.0.3538.102
reproducible in demo page: [NO]

[varnastadeus]

you should use arrow function

transSearchFn = (term: string, item: any) => {
    term = term.toLocaleLowerCase();
    return this.translateService.get(item[this.viewField])['value'].toLocaleLowerCase().indexOf(term) > -1;
  }