Comment puis-je transmettre les paramètres rendus par le backend à la méthode Bootstrap Angular 2 ?

Comment transmettre les paramètres rendus du backend à la méthode d'amorçage d'Angular2

Dans Angular2, la méthode d'amorçage lance l'application et accepte un composant ainsi qu'un tableau facultatif de fournisseurs. Cet article explique comment transmettre les paramètres obtenus à partir du backend à la méthode bootstrap.

Utilisation de l'injection de dépendances d'Angular

Une solution simple consiste à utiliser l'injection de dépendances d'Angular :

import { bootstrap } from '@angular/platform-browser-dynamic';
import { AppComponent } from "./app.component.ts";

// Retrieve headers from the server
var headers = ...;

// Pass headers to bootstrap method using dependency injection
bootstrap(AppComponent, [{provide: 'headers', useValue: headers}]);

Dans le composant ou le service qui a besoin des en-têtes, vous pouvez les injecter à l'aide de @Inject decorator :

class SomeComponentOrService {
   constructor(@Inject('headers') private headers) {}
}

Utilisation d'un fournisseur RequestOptions personnalisé

Vous pouvez également créer un fournisseur BaseRequestOptions personnalisé :

class MyRequestOptions extends BaseRequestOptions {
  constructor (private headers) {
    super();
  }
} 

// Retrieve header values from the server
var values = ...;
var headers = new MyRequestOptions(values);

// Pass the custom request options to the bootstrap method
bootstrap(AppComponent, [{provide: BaseRequestOptions, useValue: headers}]);

Cette méthode vous permet de fournir directement le fichier modifié options de requête à la méthode bootstrap, ce qui peut être utile si vous avez besoin de plus de contrôle sur la configuration de la requête.

Utilisation APP_INITIALIZER

Dans les versions récentes d'Angular (RC.5 et versions ultérieures), vous pouvez utiliser le jeton APP_INITIALIZER pour exécuter une fonction qui initialise le contexte et attend qu'il soit résolu avant le démarrage de l'application.

function loadContext(context: ContextService) {
  return () => context.load();
}

@NgModule({
  ...
  providers: [ ..., ContextService, { provide: APP_INITIALIZER, useFactory: loadContext, deps: [ContextService], multi: true } ],
})

Cette approche fournit un moyen centralisé d'initialiser le contexte et de retarder le démarrage de l'application jusqu'à ce que les données requises soient disponible.

Conclusion

En tirant parti de ces techniques, vous pouvez transmettre les paramètres rendus depuis le backend à la méthode d'amorçage Angular2, vous permettant d'injecter ces paramètres dans les composants et les services lors de la phase d'initialisation de l'application.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!