How to binding an array of string using translate pipe from ngx-translate

Question

I have this child component which has an input that receive an array of string:

<child-component list="['yes','no']"> </child-component>

I'm trying to send the data with the pipe translate from ngx-translate.

<child-component list="[{{'yes' | translate}},{{'no' | translate}}]"> </child-component>

but I didn't work.

I don't want to use the pipe in the child component code, so, is there a way to send it already translated?

Answer 1

Just translate your labels directly in the component, like:

export class AppComponent implements OnInit {
    labels: string[] = ['yes', 'no'];

    constructor(private translateService: TranslateService) {}
    
    ngOnInit(): void {
        this.translateService
            .get(this.labels)
            .subscribe((res: string[]) => {
                console.log(res);
                //=> translated labels
            });
    
        // Or
        this.translateService.instant('yes');
        this.translateService.instant('no');
    }
}