は、現在、私の<em>main.ts</em>ファイルは次のようになります

Question

ファイル：

declare const require; 
const translations = require("raw-loader!./locale/messages.de.xlf"); 

platformBrowserDynamic().bootstrapModule(AppModule, { 
    providers: [ 
    { provide: TRANSLATIONS, useValue: translations }, 
    { provide: TRANSLATIONS_FORMAT, useValue: 'xlf' } 
    ] 
}); 

代わりのこの"raw-loader!./locale/messages.de.xlf"をハードコーディング私は、この文字列を提供して代わりにサービスを利用したいと思います

const translations = require(translationService.localeString); //does not work! 

可能な方法はありますか？私はすでにサービスを作成しましたが、main.tsファイルに挿入する方法が見つかりません。

Answer 1

サービスを使用するには、そのインスタンスが必要です。 Injectorを使用してコンストラクタなしでインスタンスを作成できます。

DemoService：

@Injectable() 
export class DemoService { 
    test="hi"; 
    localeString="abc"; 
} 

Main.ts：私は、アラート内で使用していますよう

import {Injectable, ReflectiveInjector } from '@angular/core'; 
    var injector = ReflectiveInjector.resolveAndCreate([DemoService]); 
    var demoService = injector.get(DemoService) 
    alert(demoService.test) 
    platformBrowserDynamic().bootstrapModule(AppModule, { 
    providers: [ 
     { provide: TRANSLATIONS, useValue: demoService.localeString }, 
     { provide: TRANSLATIONS_FORMAT, useValue: 'xlf' } 
    ] 
    }); 

今、私たちはサービスのvariableorメソッドを使用することができます（）

デモ：http://plnkr.co/edit/Df6xSxJPaCZVupyMmtUp?p=preview

定数値にアクセスするためのサービスは必要ありません。これを行うもう1つの推奨方法は、定数変数を別のファイル（環境変数など）に保存することです。

environment.ts：

export const environment = { 
    localeString: "raw-loader!./locale/messages.de.xlf" 
}; 

main.tsを変更します。

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 

import { AppModule } from './app/app.module'; 
import { environment } from './environments/environment'; 

platformBrowserDynamic().bootstrapModule(AppModule, { 
    providers: [ 
    { provide: TRANSLATIONS, useValue: environment.localeString }, 
    { provide: TRANSLATIONS_FORMAT, useValue: 'xlf' } 
    ] 
});