Angular 1プロバイダをAngular 2に変換する正しい方法は

Question

Angular1サービスと工場をAngular2に変換する方法に関する多くのドキュメントと例がありますが、ng1プロバイダを同等のものに変換する方法については何も見つかりませんng2で

例プロバイダ

function AlertService() { 
    this.toast = false; 

    this.$get = getService; 

    this.showAsToast = function(isToast) { 
     this.toast = isToast; 
    }; 

    getService.$inject = ['$timeout', '$sce']; 

    function getService ($timeout, $sce) { 
     var toast = this.toast, 
      alertId = 0, // unique id for each alert. Starts from 0. 
      alerts = [] 

     return { 
      factory: factory, 
      add: addAlert 
     }; 

     function factory(alertOptions) { 
      var alert = { 
       type: alertOptions.type, 
       msg: $sce.trustAsHtml(alertOptions.msg), 
       id: alertOptions.alertId, 
       toast: alertOptions.toast 
      }; 
      alerts.push(alert); 

      return alert; 
     } 

     function addAlert(alertOptions) { 
      alertOptions.alertId = alertId++; 
      var alert = this.factory(alertOptions); 

      return alert; 
     } 

    } 


} 

angular 
    .module('angularApp', []) 
    .provider('AlertService', AlertService); 

何角度2で、このための正しい同等のでしょうか？

Answer 1

は、[OK]をので、最終的に我々はhttps://github.com/jhipster/generator-jhipster/issues/3664#issuecomment-251902173ここ

のおかげでそれを考え出しNG2

import {Injectable, Sanitizer, SecurityContext} from '@angular/core'; 

@Injectable() 
export class AlertService { 

    private alertId: number; 
    private alerts: any[]; 

    constructor(private sanitizer: Sanitizer, private toast: boolean) { 
     this.alertId = 0; // unique id for each alert. Starts from 0. 
     this.alerts = []; 
    } 

    factory(alertOptions): any { 
     var alert = { 
      type: alertOptions.type, 
      msg: this.sanitizer.sanitize(SecurityContext.HTML, alertOptions.msg), 
      id: alertOptions.alertId, 
      toast: alertOptions.toast 
     }; 
     this.alerts.push(alert); 
     return alert; 
    } 

    addAlert(alertOptions, extAlerts): any { 
     alertOptions.alertId = this.alertId++; 
     var alert = this.factory(alertOptions); 
     return alert; 
    } 

    isToast(): boolean { 
     return this.toast; 
    } 
} 

でのサービスであり、ここではサービスのプロバイダである

import { Sanitizer } from '@angular/core'; 
import { AlertService } from './alert.service'; 

export function alertServiceProvider(toast?: boolean) { 
    // set below to true to make alerts look like toast 
    let isToast = toast ? toast : false; 
    return { 
     provide: AlertService, 
     useFactory: (sanitizer: Sanitizer) => new AlertService(sanitizer, isToast), 
     deps: [Sanitizer] 
    } 
} 

は、今あなたがする必要がありますモジュールのプロバイダ宣言でalertServiceProviderメソッドを呼び出します。

@NgModule({ 
    imports: [ 
     ... 
    ], 
    declarations: [ 
     ... 
    ], 
    providers: [ 
     ... 
     alertServiceProvider() 
    ], 
    exports: [ 
     ... 
    ] 
}) 
export class SharedCommonModule {} 

コードがJHipsterプロジェクトの一部であり、あなたは、実際のテンプレート