Angularjs in ASP.NET MVC 5 integrieren

Question

Lassen Sie mich zuerst erklären, dass ich .NET-Programmierhintergrund habe und ich Angularjs neu bin.

Ich habe eine MVC 5-Anwendung und ich möchte einen neuen Abschnitt, der mit Angularjs als Single Page Application gebaut wird.

Bisher habe ich einen MVC 5 Controller mit einer Indexaktion. In der Index.cshtml-Ansicht wird das SPA mit Angularjs erstellt, das ein Router-Modul verwendet. Der Angular ruft andere Seiten im HTML-Format auf.

Mein Problem ist, dass HTML-Seiten verweisen Bilder wie folgt: <img src="img/image.png"> aber wenn die Anwendung nicht im Stammordner gehostet wird, sind die Pfade falsch.

Ich muss es so tun: <img src="@Url.Content("~/img/image.png")"> formatieren den richtigen Pfad für die Bilder, aber ich kann es nicht in HTML-Seiten tun.

Können Sie mir sagen, wie man sie von .html zu .cshtml konvertiert, um die Hilfe von Razor zu verwenden? Außerdem muss ich wissen, wo empfohlen wird, diese Seiten relativ zu Index.cshtml in einer Standard-MVC 5-Anwendung zu platzieren?

Answer 1

Wenn Sie Ihre AngularJs-Vorlagen in .cshtml (Razor) erstellen möchten, müssen Sie Teilaktionen für sie erstellen. Erstellen Sie eine Aktion in Ihrem MVC-Controller und geben Sie die Ansicht wie in normalen MVC zurück. Beachten Sie, dass Sie das Layout auf null einstellen müssen, damit das vollständige Layout beim Anzeigen dieser Teilansichten nicht gerendert wird. In Angular müssen Sie diese Aktionen über ihre vollständige Route referenzieren.