Constantes globales Angular 2

1. Declarar constantes globales de Angular 2
2. Beneficios de las constantes globales

El framework Angular 2 tiene muchas constantes que son utilizadas por los diferentes componentes del framework. Se puede acceder a estas constantes mediante el módulo angular2, que está disponible en la raíz del directorio de su proyecto.

Para ahorrar tiempo, tomamos la ayuda de las constantes globales. Las constantes globales de Angular 2 almacenan un valor en un espacio de nombres global.

Proporcionan una forma de realizar un seguimiento de los datos que necesitan todas las partes de la aplicación. Esto es útil cuando necesitamos acceder al mismo valor desde diferentes partes de la aplicación.

Declarar constantes globales de Angular 2

Angular 2 proporciona un mecanismo para declarar constantes globales. Las constantes globales se declaran mediante la palabra clave const y se puede acceder a ellas desde cualquier parte de la aplicación.

Se trata de seguir los pasos a continuación.

1. Cree un archivo de constantes agregándole la extensión .ts.
2. Escriba el valor constante en el archivo y expórtelo como una variable global utilizando la palabra clave predeterminada de exportación const.
3. Importe este archivo en el módulo de su aplicación usando la palabra clave de importación seguida de la ruta de su archivo constante.

Ejemplo de código:

const MY_CONSTANT = 'This is my constant';

// Use MY_CONSTANT in the rest of your app like this:

console.log(MY_CONSTANT);

Analicemos un ejemplo completo de las constantes globales de Angular 2 para comprender mejor cómo funciona.

Código mecanografiado:

import { Component } from '@angular/core';
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
   readonly CONSTANTS = CONSTANTS;
  global: { name: string; };
  constructor() {
    this.global = { name: 'demo' }
  }
}
export const CONSTANTS = {
  'globalName': 'demo'
}

Código HTML:

<h1>Example of Angular 2 Global Constants</h1>
<span *ngIf="global.name === CONSTANTS.globalName ">
    Hello World
</span>

Beneficios de las constantes globales

Angular 2 usa constantes globales para facilitar a los desarrolladores el trabajo con números. En Angular 2, las constantes globales se usan como una alternativa a los valores de codificación rígida en el código.

Los beneficios de usar constantes globales en Angular 2 son los siguientes.

1. Los desarrolladores pueden trabajar con números más fácilmente.
2. Los valores se pueden cambiar sin cambiar el código.
3. Los desarrolladores pueden realizar cambios rápidamente.
4. El desarrollador no tiene que preocuparse por errores tipográficos o errores porque el compilador los detectará.

Haga clic aquí para ejecutar el ejemplo de código anterior.