サーチ…


前書き

この記事では、アプリケーションがブートストラップする前にAngularアプリに外部データを渡す方法を示します。この外部データは、設定データ、レガシーデータ、サーバレンダリングなどとすることができる。

依存性注入による

Angularのブートストラップコードを直接呼び出す代わりに、ブートストラップコードを関数にラップして関数をエクスポートします。この関数はパラメータを受け入れることもできます。

import { platformBrowserDynamic } from "@angular/platform-browser-dynamic";
import { AppModule } from "./src/app";
export function runAngular2App(legacyModel: any) {
       platformBrowserDynamic([
           { provide: "legacyModel", useValue: model }
       ]).bootstrapModule(AppModule)
       .then(success => console.log("Ng2 Bootstrap success"))
       .catch(err => console.error(err));
}

そして、どのサービスやコンポーネントでも、「レガシーモデル」を注入してアクセスすることができます。

import { Injectable } from "@angular/core";
@Injectable()
export class MyService {
   constructor(@Inject("legacyModel") private legacyModel) {
      console.log("Legacy data — ", legacyModel);
    }
 }

アプリを必要とし、それを実行します。

require(["myAngular2App"], function(app) {
   app.runAngular2App(legacyModel); // Input to your APP
});


Modified text is an extract of the original Stack Overflow Documentation
ライセンスを受けた CC BY-SA 3.0
所属していない Stack Overflow