Wie @ Angular/Animationen in eckigen asp.net Core 2 Vorlage verwenden?

Question

Ich kann nicht @angular/animations in app.module.shared Datei importieren: Wenn ich @angular/animations in app.module.browser importieren, funktionieren Dateianimationen nicht.

Was ich für Material Animationen in Winkel asp.net Kern 2 Vorlage tun müssen?

Answer 1

Ich habe zunächst die Animationen in die app.module.shared-Datei importieren, und ich habe den gleichen Fehler. Um es zu beheben, habe ich den Import in die Datei app.module.browser verschoben.

Dies ist, wie ich meine module.browser links:

import { NgModule } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; 
import { AppModuleShared } from './app.module.shared'; 
import { AppComponent } from './components/app/app.component'; 

@NgModule({ 
    bootstrap: [ AppComponent ], 
    imports: [ 
     BrowserModule, 
     BrowserAnimationsModule, 
     AppModuleShared 
    ], 
    providers: [ 
     { provide: 'BASE_URL', useFactory: getBaseUrl } 
    ] 
}) 
export class AppModule { 
} 

export function getBaseUrl() { 
    return document.getElementsByTagName('base')[0].href; 
} 

Beispiel für die Verwendung BrowserAnimationsModule: https://github.com/aspnet/JavaScriptServices/commit/c0c47e3def208873c470a524a826f8d235a5f9de

Answer 2

Der Fehler wird verursacht, geschrieben, weil @angular/animations DOM Referenzen verwendet, wie Dokument und Fenster.

standardmäßig ASP.NET MVC Core-SPA-Anwendungen erstellt die ursprüngliche Vorlage wird Ihre Javascript-Code auf server vorrendern, wie in Ihrem Index Ansicht definiert.

<app asp-prerender-module="ClientApp/dist/main-server">Loading...</app> 

So können Sie nicht DOM Referenzen auf Server und Shared Module hinzufügen.

Sie haben @ Winkel/Animation app.module.browser.ts hinzufügen und es dann auf Ihre Submodule und/oder Komponenten.