Stammmodul der Anwendung konfigurieren

Das Standardstammmodul in einer Angular-Anwendung ist app.module.ts. Sie müssen das Stammmodul app.module.tsder konsumierenden Anwendung konfigurieren.

1. Importieren Sie BucSvcAngularModule aus @buc/svc-angular und fügen Sie es mit der Methode forRoot() zum Array imports hinzu. Dieses Modul wird von der Bibliothek @buc/svc-angular exportiert und darf nur im Modul app.module.ts hinzugefügt werden. Das Hinzufügen zu einem anderen Lazy-loaded-Modul führt zu einem Fehler.

   import { BucSvcAngularModule } from '@buc/svc-angular';
        .
        .
        imports [
            BucSvcAngularModule.forRoot()
        ]

2. Fügen Sie in der Datei constructor für das Modul den Aufruf super() mit den erforderlichen Parametern hinzu.
   • Der Modulklassenname für app.module.ts, AppModule, muss BucCommonClassesAllModuleClazzerweitern.
     Anmerkung: Sie müssen diesen Schritt für alle anderen Module ausführen.
   • BucCommonClassesAllModuleClazz stellt sicher, dass translationService automatisch die aktuell ausgewählte Sprache für den Benutzer verwendet.
   • Die Superklasse subskribiert Ereignisse für das erste geladene Modul. Das mit Spannung geladene app.module.ts ist zwangsläufig das erste Modul, das geladen wird, und löst daher die Logik für die Subskription der Shellereignisse aus. Nach der Superklasse geladene Module subskribieren die Ereignisse nicht.
   • Im Folgenden sehen Sie ein Beispiel-Code-Snippet:

       import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
       import { TranslateService } from '@ngx-translate/core';
       import {
           BucCommonClassesAllModuleClazz,
           BucCommShellStaticPatternIframeService
       } from '@buc/svc-angular';
       .
       .
       export class AppModule extends BucCommonClassesAllModuleClazz {
           constructor(translateService: TranslateService,
                       bucCommShellStaticPatternIframeService: BucCommShellStaticPatternIframeService) {
     
               super(translateService, bucCommShellStaticPatternIframeService);
           }
       }

3. Fügen Sie HTTP für die Anwendung hinzu. Fügen Sie den Interceptor einmal in app.module.tshinzu. Bei Bedarf kann die Anwendung weitere Interceptor hinzufügen, aber der erste Interceptor in der Folge muss der aus @buc/svc-angular: BucCommBEHttpInterceptorServicesein.
   • Sie müssen die erforderlichen Header zu den Endpunkten für Aufrufe an Sterling™ Order Management System, Sterling Intelligent Promising Inventory Visibility, Sterling Fulfillment Optimizer with Watson und das Order Hub Backend hinzufügen.
   • Im Folgenden sehen Sie ein Beispiel-Code-Snippet:

       import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
       import { BucCommBEHttpInterceptorService } from '@buc/svc-angular';
       .
       .
       imports [
           HttpClientModule
       ]
       .
       .
       providers: [
           // Any other interceptor added by buc-custom-app-starter to be added before 
           // so that error handling starts from BucCommBEHttpInterceptorService (it is in reverse).
           {
               provide: HTTP_INTERCEPTORS,
               useClass: BucCommBEHttpInterceptorService,
               multi: true
           }
       ]

4. Fügen Sie Inhalte hinzu, die sich auf die Übersetzung beziehen. Stellen Sie sicher, dass Sie die folgenden Konventionen einhalten:
   • export class <application name><module name>Bundles.

     Hier wird <application name> von buc-custom-app-starter als BucCustomAppStarter angegeben und <module name> ist AppModule.

     Beispiel: export class BucCustomAppStarterAppModuleBundles
     Gibt eine Liste der Bundles zurück, die von diesem Modul verwendet werden. Wenn Sie ein angepasstes gemeinsam genutztes Modul oder ein Kernmodul verwenden, müssen Sie hier auch die zugehörigen Bundles hinzufügen, da die translateService -Instanz nur die Bundles verwendet, die im aktuellen Modul angegeben sind.

   • export function <application name><module name>HttpLoaderFactory

     Hier wird <application name> als bucCustomAppStarter angegeben und <module name> ist AppModule.

     Beispiel: bucCustomAppStarterAppModuleHttpLoaderFactory
     Gibt eine neue Instanz von BucMultiTranslateHttpLoader zurück, die die in der Bundleklasse aufgelisteten Bundles lädt.

   • BucMultiTranslateHttpLoader

     Wird von @buc/svc-angular bereitgestellt und bietet die Möglichkeit, mehrere Paketdateien für ein Modul zu laden. Obwohl BucMultiTranslateHttpLoader nicht immer benötigt wird, da Module in der Regel nur eine zu ladende Bundledatei haben, ist dies eine empfohlene Konvention.

   • Fügen Sie die erforderlichen Dateien und Ordner nls und json hinzu. Weitere Informationen zu den empfohlenen Konventionen für die Dateien nls und json finden Sie unter Empfohlene Konventionen für Übersetzungen.
   Hinweis:

   • Wenn Sie TranslateModule zum imports -Array hinzufügen, ruft app.module.ts TranslateModule.forRoot()auf. Alle anderen Module rufen TranslateModule.forChild()auf.
   • Sie müssen diesen Schritt auch für alle anderen Module ausführen.
5. Hinzufügen AppRoutingModule , um das Routing in der Anwendung zu aktivieren. Weitere Informationen zur Konfiguration des Root-Routing-Moduls app routing.module.tsder Anwendung finden Sie unter Root-Routing-Modul der Anwendung konfigurieren.
6. Stellen Sie sicher, dass sich die relevanten importierten Module im Array imports befinden.

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { BucSvcAngularModule } from '@buc/svc-angular';
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { AppRoutingModule } from './app-routing.module';

import { TranslateService } from '@ngx-translate/core';
import { HttpClient } from '@angular/common/http';
import {
    BucCommonClassesAllModuleClazz,
    BucCommShellStaticPatternIframeService,
    BucCommBEHttpInterceptorService,
    BucMultiTranslateHttpLoader
} from '@buc/svc-angular';

export class BucCustomAppStarterAppModuleBundles {
    static bundles: Array<any> = [{
        prefix: './assets/buc-custom-app-starter/i18n/',
        suffix: '.json'
    }];
}

export function bucCustomAppStarterAppModuleHttpLoaderFactory(http: HttpClient) {
    return new BucMultiTranslateHttpLoader(http, BucCustomAppStarterAppModuleBundles.bundles);
}

@NgModule({
    declarations: [
        AppComponent
    ],
    imports: [
        BrowserModule,
        CommonModule,
        BucSvcAngularModule.forRoot(),
        HttpClientModule,
        TranslateModule.forRoot({
            loader: {
                provide: TranslateLoader,
                useFactory: bucCustomAppStarterAppModuleHttpLoaderFactory,
                deps: [HttpClient]
            },
            isolate: true
        }),
        AppRoutingModule
    ],
    providers: [
        // Any other interceptor added by buc-custom-app-starter to be added before 
so that error handling starts from BucCommBEHttpInterceptorService (it is in reverse).
        {
            provide: HTTP_INTERCEPTORS,
            useClass: BucCommBEHttpInterceptorService,
            multi: true
        }
    ],
    bootstrap: [AppComponent]
})
export class AppModule extends BucCommonClassesAllModuleClazz {
    constructor(translateService: TranslateService,
                bucCommShellStaticPatternIframeService: BucCommShellStaticPatternIframeService) {

         super(translateService, bucCommShellStaticPatternIframeService);
    }
}