Setting another value for a translation key should be updated

[rabr2ro]

I'm submitting a ... (check one with "x")

[x] bug report => check the FAQ and search github for a similar issue or PR before submitting
[ ] support request => check the FAQ and search github for a similar issue before submitting
[ ] feature request

Current behavior

From what I could see, translations member, within TranslationService, for a specific language, is not a dictionary but an object tree. For example:

translations[EN] = {
    'user': {
         'firstName': 'First Name',
         'lastName': 'Last Name'
    }
}

so, to use one of the keys in the pipe, you simply write

{{ 'user.firstName' | translate }}

The signature for setting another value for one of the key is:

public set(key: string, value: string, lang: string = this.currentLang): void

so, if one wants to change from code the value of the firstName, would inject TranslationService and do

this.translationService.set('user.firstName', 'Only Name')

but the current implementation is not having the desired result, because, after executing the previous set, the translations object inside TranslatonService will look like this:

translations[EN] = {
    'user': {
         'firstName': 'First Name',
         'lastName': 'Last Name'
    },
    'user.firstName': 'Only Name'
}

So, either I do not use correctly the set method, in which case the documentation should be updated, or it's internal implementation should be updated

this.translations[lang][key] = value;

Reproduction of the problem
If the current behavior is a bug or you can illustrate your feature request better with an example, please provide the steps to reproduce and if possible a minimal demo of the problem via https://plnkr.co or similar (you can use this template as a starting point: http://plnkr.co/edit/tpl:btpW3l0jr5beJVjohy1Q).

Please tell us about your environment:

• ng2-translate version: 2.4.2
• Angular version: 2.0.0-rc.5
• Browser: [ Chrome XX | Firefox XX ]
• Language: [ TypeScript 1.8 ]

[ocombe]

Good point, I'll have to fix that :)

[rabr2ro]

Thank you. I have a possible implementation for the problem, but it's in my own service that is a wrapper for the TranslationService. If you want, I can put here the code that I have (is TypeScript), you can take a look and you can refine it and included in the TranslationService implementation. Let me know if you would like to see what I have.

[ocombe]

sure, that would help, thanks

[rabr2ro]

Ok. So here it is:

private set(key: string, value: string): void {
        let translations: any = (<any>this._translationService).translations[this._translationService.currentLang];
        let path: string[] = key.split('.');
        this.setDeepValue(translations, value, path);

        this._translationService.onTranslationChange.emit(<TranslationChangeEvent>{
            translations: translations,
            lang: this._translationService.currentLang
        });
    }

private setDeepValue(obj: any, value: any, path: string[]): void {
        if (path.length > 1) {
            let fragment: string = path.shift();
            if (obj[fragment] == null || typeof obj[fragment] !== 'object') {
                obj[fragment] = {};
            }
            this.setDeepValue(obj[fragment], value, path);
        } else {
            obj[path[0]] = value;
        }
    }

where this is the instance of my wrapper service, which has TranslationService injected as _translationService member. I had to do a cast to any, so that I can address internal translations member, within the service. setDeepValue it's an adaptation of a function that I found on StackOverflow :)

[StefH]

@ocombe
Any update on this issue ?

[Mwoagh]

Yes, I would also like this fixed.

[topikus]

Any update on this issue ?

[anasvn]

any updates. Why this is still getting issue in 2020?

[krrr25]

@ocombe
Any updates on this feature?

[jaznjaz]

2021 still no updates ?

[Mitthraw]

Well we are now in 2022 and this is still not working...