Where to store plain text (magic strings) in Angular

Question

In my Angular application I want to set simple error/notification messages in my controller. An example of this uses the Material Snackbar for Angular:

this.snackBar.open(
  'Order successful',
  'OK',
  { duration: 2500 }
);

My problem is now, that I don't like to have 'magic strings' for my messages in my controllers. Is there a best practice of storing this messages?

I thought about using 2.4 TypeScript enums with associated values in a dedicated error-message-model.

Experiences and suggestions are very welcome.

score 2 · Answer 1 · answered Apr 15 '18 at 06:40

You can use ng-translate for storing all your strings.

Then you can inject the service in your controller and use it to get strings like this:

translate.get('HELLO').subscribe((res: string) => {
  console.log(res);
  //=> 'hello world'
});

Or you can directly use it in template like this:

<div>{{ 'HELLO' | translate }}</div>

You can also have multiple languages support using this and it provides methods to listen for changes like language change.

Where to store plain text (magic strings) in Angular

1 Answers1