How to set bindLabel when using pipe?

I have this in my html, needed to use ng-template because of pipe.

    <ng-select [items]="codeList" [virtualScroll]="true"
                      [(ngModel)]="selectedCode" 
                      bindValue="code" name="name-code" required>
            <ng-template ng-option-tmp let-item="item">
                <div title="item">{{item | translateCode: (infoService.getCurrentLanguage())}}</div>
            </ng-template>
    </ng-select>

List of options in dropdown is showing ok, but when I select some option it doesn’t shows. Of course, search is not working either.

How is possible to call function for translation of every option/item so that ng-select works okay? One way would be function in bindLabel, but for now I can see it only accepts string.

[majadinjar]

I found this solution:

<ng-select [items]="codeList" [virtualScroll]="true"
                      [(ngModel)]="selectedCode" 
                      [searchFn]="searchCode" [compareWith]="byCode"
                     name="name-code" required>
            <ng-template ng-option-tmp let-item="item">
                <div title="item">{{item | translateCode: (infoService.getCurrentLanguage())}}</div>
            </ng-template>
</ng-select>

Add two functions - searchFn and compareWith (see ng-select docs for explanation).

[keivansahebdelfard]

I’m running into this same issue now. I’m assuming there’s no way to use a pipe on the bindLabel?

In this instance I’m passing an array of enum values to items. I have a pipe that translates the enum to something more presentable to the user, so really in this case specifically I actually don’t need the bind label but I do need to transform the displayed values.

I know I could use a vanilla instead and achieve the results I want but I’m trying to implement this in a reusable pattern with other arrays of various types. This might be a little too ambitious though.

hope this work

export enum Smpl{
  Name1 = 1,
  Name2 = 2,
  Name3 = 3,
}

export const SmplLbl = new Map<number, string>([
  [Smpl.Name1, "otherName1"],
  [Smpl.Name2, "otherName2"],
  [Smpl.Name3, "otherName3"],
]);

export interface NgCombo {
  value: number;
  label: string;
}

 enumDS(T1, T2) {
    var _res: NgCombo[] = [];

    for (let key in T1) {
      if (!isNaN(Number(key))) {
        _res.push({ label: T2.get(parseInt(key)), value: parseInt(key) });
      }
    }

    return _res;
  }

using :

 this.ngSelectDataSource = this.sharedSv.enumDS(Smpl, SmplLbl);