How can I update a value using a specific key in Angular?

Question

How can I update a value using a specific key in Angular?

So, I have a string value that I need to pass to another function. For instance, if the string is 'eng', I want it to be converted to 'en'. I'm looking for a solution that does not involve using slice or if statements. I attempted to create an enum, but unfortunately, that did not work as expected.

ngOnInit(): void {    
this.setLocaleDateFormat(this.translateService.currentLang);
    }

 setLocaleDateFormat(language: Languages): void {
    this.dateAdapter.setLocale(language);   } 

export enum Languages {   
'eng' = 'en',   
'slk' = 'sk',   
'cze' = 'cz',
 }

Essentially, I need to pass a value and based on some criteria, change it to something else. For example, I receive 'eng' but I want to set the locale to 'en'.

angular typescript

Answer 1

Answer №1

It appears that when calling

this.translateService.currentLang

, the result will likely be 'eng'. However, there is some uncertainty around this assumption, so it's best to revisit your initial question. Instead of defining languages as an enum, consider using a constant object.

export const Languages = {
  eng: 'en',
  slk: 'sk',
  cze:  'cz',
};

setLocaleDateFormat(): void {
    this.dateAdapter.setLocale(Languages[this.translateService.currentLang]);
}

Answer 2

It appears that when calling

this.translateService.currentLang

, the result will likely be 'eng'. However, there is some uncertainty around this assumption, so it's best to revisit your initial question. Instead of defining languages as an enum, consider using a constant object.

export const Languages = {
  eng: 'en',
  slk: 'sk',
  cze:  'cz',
};

setLocaleDateFormat(): void {
    this.dateAdapter.setLocale(Languages[this.translateService.currentLang]);
}

Answer 3

Answer №2

The kind of lingo isn't Lingo which stands for

"en" | "sk" | "cz"

, but rather keyof typeof Lingoes.

Playground

function setLanguage(locale: Lingoes) {
  console.log('setLanguage to', locale);
}

enum Lingoes {   
 'eng' = 'en',   
 'slk' = 'sk',   
 'cze' = 'cz',
}

function setLanguageDialect(lingo: keyof typeof Lingoes): void {
  setLanguage(Lingoes[lingo]);
} 

setLanguageDialect('eng');

Answer 4

The kind of lingo isn't Lingo which stands for

"en" | "sk" | "cz"

, but rather keyof typeof Lingoes.

Playground

function setLanguage(locale: Lingoes) {
  console.log('setLanguage to', locale);
}

enum Lingoes {   
 'eng' = 'en',   
 'slk' = 'sk',   
 'cze' = 'cz',
}

function setLanguageDialect(lingo: keyof typeof Lingoes): void {
  setLanguage(Lingoes[lingo]);
} 

setLanguageDialect('eng');

Answer 5

Answer №3

Start by defining a reference object:

const languageMap = {eng: 'en', slk: 'sk', cze: 'cz'};

Next, you can implement it in your code like so:

ngOnInit(): void {    
    this.setLocaleDateFormat(languageMap[this.translateService.currentLang] || 'defaultLocale');
}

setLocaleDateFormat(lang: string): void {
    this.dateAdapter.setLocale(lang);   
}

Answer 6

Start by defining a reference object:

const languageMap = {eng: 'en', slk: 'sk', cze: 'cz'};

Next, you can implement it in your code like so:

ngOnInit(): void {    
    this.setLocaleDateFormat(languageMap[this.translateService.currentLang] || 'defaultLocale');
}

setLocaleDateFormat(lang: string): void {
    this.dateAdapter.setLocale(lang);   
}

How can I update a value using a specific key in Angular?

Answer №1

Answer №2

Answer №3

Similar questions

Transforming two child arrays within an object into a single array using Ramda

How to determine the presence of 'document' in Typecsript and NextJS

Can you tell me if it's a problem that I can view the application structure from the console's source window?

Ways to arrange objects to fill up space in a specific sequence

Why does VSCode open a React app in Edge instead of Chrome?

What is the best way to test for errors thrown by async functions using chai or chai-as-promised?

How can Angular developers properly implement token refreshing in their applications?

The function you are trying to call is not valid... the specified type does not have any call signatures [ts 2349

How to Hide Warning Messages in Angular NPM Package for Production Environment

Angular can display text on hover based on the state shown in a <td> element

Incorporate Lodash into your Angular2 project within Visual Studio 2015

Tips for integrating jwt token into axios request

The intersection type of an array gets lost when used in the map() function

What should be used in Angular 2 Reactive Forms - controls or get()?

Generate a Jest dummy for testing an IncomingMessage object

Parsing a JSON array using Moment.js within a subscription function

What's stopping me from using useState() to assign API data to an array?

Guide to Implementing Kendo-Grid in Angular 4 CLI

Unused code splitting chunk in React production build would improve performance and efficiency of

Display an API generated popup list using Vue's rendering capabilities