Core: Support for links and shortcuts

Created on 15 Jun 2016  路  9Comments  路  Source: ngx-translate/core

I am currently porting an app from Angular 1 to 2. This app uses the links and shortcuts feature of Angular-Translate. It seems like it's not supported, could this be in the plans ?

low help wanted feature request

Most helpful comment

@cronosxfiles binding to translateParams accomplishes what #141 asked for.

Example:

<div translate="FIELD_REQUIRED" [translateParams]="{field: 'FIRST_NAME' | translate}"></div>
"FIELD_REQUIRED": "{{field}} is required"
"FIRST_NAME": "First Name"

results in

First Name is required

All 9 comments

That would be a nice feature, it's not really on my todo list but I'd like a PR with this

Definite +1 (especially if {{'HELLO'|translate:{value:'@WORLD'} }} would indeed do Hola Mundo in spanish per #141)...

I guess there's nobody working on this. I've just found myself in the same need as for #141. Have anyone found a workaround for having the key value translated outside the translation pipe so the translated result can be provided as a parameter's key value?

hey
I temporarily solved this problem. ^^;;
as problem : {{ 'Forms.Validation.Required' | translate : { field: 'Users.Reference' | translate } }}
to solved :

Was it helpful? :)

I've tried this and got the error: "Can't bind to 'translate-value-field' since it isn't a known property of..."

@cronosxfiles binding to translateParams accomplishes what #141 asked for.

Example:

<div translate="FIELD_REQUIRED" [translateParams]="{field: 'FIRST_NAME' | translate}"></div>
"FIELD_REQUIRED": "{{field}} is required"
"FIRST_NAME": "First Name"

results in

First Name is required

I made a pipe that can be used like this :

{{ 'KEY_TO_TRANSLATE' | translate: (values | ParamsTranslate) }}

Here is the pipe code :

import { Pipe, PipeTransform } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
import { first } from 'rxjs/operators/first';
import { map } from 'rxjs/operators/map';

@Pipe({
    name: 'ParamsTranslate'
})
export class ParamsTranslatePipe implements PipeTransform {
    constructor(private _translate: TranslateService) {}

    transform(obj: Object): Object {
        const newObject = Object.assign({}, obj);
        Object.keys(obj).forEach(
            key =>
                obj[key].length
                    ? this._translate
                          .get(obj[key])
                          .pipe(first(), map(value => value))
                          .subscribe(value => (newObject[key] = value))
                    : undefined
        );
        return newObject;
    }
}

Here is a stackblitz demo : https://stackblitz.com/edit/ngx-translate-params-translate

I'm struggling with the same problem as @Bouzmine. Have anyone has found any solution, except modifying the translation file?

I want to comment for others facing this problem.
If you want to use translation as attributes, then look at @acantrell answer.
If not, then @ibenjelloun answer is the right one.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

louisdoe picture louisdoe  路  3Comments

egornoveo picture egornoveo  路  4Comments

jellene4eva picture jellene4eva  路  3Comments

crebuh picture crebuh  路  3Comments

dankerk picture dankerk  路  3Comments