Sollte ich AngularJS und ASP.NET MVC verwenden?

58

Ich habe angefangen, AngularJS und ASP.NET MVC zu lernen, bin mir aber nicht sicher, warum ich beide gemeinsam in einem Projekt verwenden soll?

Sind sie nicht beide MVC-Frameworks? Sollte ich beide in derselben Anwendung verwenden? Ist es nicht der eine oder andere?

Natalie
quelle

Antworten:

74

Wenn Sie eine Single-Page-Anwendung (SPA) erstellen , benötigen Sie die "MVC" in ASP.NET MVC wahrscheinlich nicht . Ansichten, insbesondere dynamische Ansichten, werden wahrscheinlich clientseitig geliefert / manipuliert. Eckige Griffe, die einfach gut sind.

Aber vielleicht möchten Sie kein 100% SPA. Dann was? Stellen Sie sich stattdessen 10 Seiten vor, aber 10 Seiten sind sehrdynamisch. Nachdem sich ein Benutzer angemeldet hat, befindet sich in der rechten Ecke ein kleines Benutzerabzeichen. Das ist nicht dynamisch. Es zeigt nur ein paar raffinierte Dinge wie die "Punktzahl" des Benutzers und sein letztes Selfie. Sie zwischenspeichern die raffinierten Dinge, damit sie leicht abgerufen werden können. Damit können Sie zwei Wege gehen. Wenn Sie ein clientseitiger MVC-Purist sind, rufen Sie einfach die Ausweisdaten ab, nachdem die anfängliche HTML-Nutzlast geliefert wurde, genau wie alle anderen Daten. Aber vielleicht bist du kein Purist. Vielleicht bist du das Gegenteil eines Puristen. Vielleicht bist du ein Unreiner. Anstatt den anfänglichen HTML-Code bereitzustellen, müssen Sie JavaScript bereitstellen, das auf Ihren Server zurückgesendet wird, über JavaScript posten, um Ausweisdaten abzurufen, und diese Daten schließlich über die clientseitige MVC in einer Ansicht zusammenführen.das als dein anfängliches HTML. Nachdem Ihr anfänglicher HTML-Code geliefert wurde, fahren Sie mit Ihren typischen clientseitigen MVC-Possen fort.

Also ... MVC auf dem Server und auf dem Client ist nur eine bequeme Möglichkeit, Code zu organisieren, der 2001 ein Chaos war. Sie müssen sich nicht für den einen oder anderen entscheiden. Sie können beides auswählen. Zugegeben, je mehr Sie nach der ersten HTML-Bereitstellung tun, desto weniger benötigen Sie serverseitige MVC. Trotzdem ist es für Sie da, wenn Sie es brauchen. Ich habe beispielsweise an einer ASP.NET MVC / Angular-Anwendung gearbeitet, bei der externe Angular-Vorlagen möglicherweise .NET MVC ActionResult sind. Dies bedeutet, dass Ihr Server-Controller Daten in seiner Ansicht zusammenführen, als Vorlage an Angular übermitteln und Angulars Controller dann seine Daten in der Ansicht zusammenführen kann. Ich sage nicht, dass dies eine gute Idee ist, aber es zeigt nur, dass eine Form von MVC die andere nicht überholt.

Unabhängig davon, wie Sie Angular bereitstellen, benötigen Sie eine Möglichkeit, das ursprüngliche HTML, die Vorlagen und vor allem die Daten bereitzustellen. Warum nicht eine Plattform benutzen, die es einfach macht? Es gibt viele, aber .NET MVC ist kein Trottel. Wie ich bereits sagte, können Sie die anfänglichen HTML- und externen Angular-Vorlagen als Ergebnis einer MVC-Aktion definieren. Besser noch: Sie können die Daten mithilfe der .NET- Web-API bereitstellen . Web API ist so lecker wie Aprikosenkompott.

Zusammengefasst: MVC ist nur ein Muster. Möglicherweise möchten Sie dieses Muster auf einer beliebigen Anzahl von physischen Ebenen verwenden. Es kann nicht aufgebraucht werden. Verwenden Sie es frei, wenn es Sinn macht. Außerdem ist Angular möglicherweise sowieso nicht MVC (so sagen die Leute, die sich für diese Dinge interessieren). Sie können es also auch mit einem Tool verwenden, dessen Name "MVC" enthält. Zum Teufel, auch wenn es sich um MVC handelt, mischen Sie nach Belieben.

Scant Roger
quelle
3
Erstaunliche Resonanz. Vielen Dank für Ihre Erklärung +1
Natalie
Können Sie mir zum Beispiel sagen, ob es eine Web-API gibt, die mir Daten zur Verfügung stellt, und ich diese Daten in einem Raster anzeigen möchte. Muss ich die Schleife und das Templating mit Angular oder MVC ausführen? Rufe ich den Web-API-Dienst mit welchem ​​wie auf? Wie entscheiden Sie von Beginn des Projekts an, welchen Weg Sie einschlagen wollen?
Natalie
1
@Natalie Wenn die Daten von der Web-API stammen, rufen Sie sie wahrscheinlich clientseitig ab. Dies bedeutet, dass Sie in Angular und nicht in .NET MVC gebunden sind. Du schleifst nicht explizit. Sie binden die Daten mit ngRepeat an Ihr Raster / Ihre Tabelle . Zum Abrufen der Daten verwenden Sie wahrscheinlich das $ http- Modul und rufen Ihren Web-API-Endpunkt auf. Die Entscheidung, welchen Ansatz Sie verwenden möchten, ist eigenartig. Es gibt keine Schwarz-Weiß-Antwort. Sie müssen experimentieren, bewerten und Ihren Instinkten folgen.
Scant Roger
... ein Wort zur Vorsicht. Wenn Sie Angular oder ein anderes Full-Service-JavaScript-Framework noch nicht verwendet haben, müssen Sie einige Stunden damit verbringen, sich mit den Seilen vertraut zu machen. Sie sind nicht unbedingt einfach. Ich kann Ihnen jedoch versichern, dass sie Ihr Leben auf lange Sicht einfacher machen. Hart arbeiten. Dabei bleiben. Du wirst es gut machen.
Scant Roger
1
@ScantRoger Ich entschuldige mich, aber Ihre Antwort hat die Dinge für mich nicht geklärt. Wie binde ich Angular ein, wenn ich ein serverseitiges MVC-Framework verwende, bei dem die Ansicht nicht aktiv ist? Der Server (die Web-API) enthält bereits die Modell- und Controller-Definitionen. Wenn ich also Angular verwende, wird mir erneut MVC auferlegt. Ist es am Ende also MCVCM ...? (Modell- und Controller-Definitionen sowohl auf Client- als auch auf Serverseite) Oder ist dies der Grund, warum ich kein clientseitiges MVC-Framework wie Angular verwenden sollte, wenn ich bereits ein MVC-Framework für meine Web-API verwende
Abdul
17

ASP.NET MVC ist ein serverseitiges Framework. Es ist egal, welche JavaScript-Bibliotheken Sie verwenden. AngularJS ist eine clientseitige Bibliothek, die sich nicht darum kümmert, welche serverseitige Technologie die Website antreibt - es kann sich um Python, ASP.NET MVC oder sogar um die alten statischen HTML-Dateien handeln, die direkt auf der Festplatte gespeichert sind.

ASP.NET MVC und AngularJS sind beide kompatibel, und es gibt viele Projekte, die sie zusammen verwenden.

Haben Sie müssen beide verwenden? Nicht wirklich. Es hängt ganz von den Bedürfnissen Ihres Projekts ab.

  • Wenn Ihre Website dynamisch ist, müssen Sie einige serverseitige Skripts verwenden. Sie könnten ASP.NET verwenden, und die Tatsache, dass Sie AngularJS verwenden, wird Ihren serverseitigen Code nicht mehr MVC machen. Wenn Sie Ihre serverseitige Anwendung als MVC strukturieren möchten, wählen Sie lieber ASP.NET MVC.

  • Ebenso hat die Tatsache, dass Sie ASP.NET MVC verwenden, keine Auswirkungen auf die Struktur Ihres clientseitigen Codes. Sie können Ihr gesamtes JavaScript in einer einzigen Datei ablegen, ohne sich Gedanken über die Struktur zu machen, und damit zufrieden sein (bis das Projekt wächst). Auch hier bietet sich AngularJS an, um Ihre Anwendung clientseitig zu strukturieren.


Randnotiz: Sie haben Ihre Frage mit ASP.NET MVC 3 markiert. Sofern es sich nicht um ein Legacy-Projekt handelt, das Sie warten müssen oder wenn Sie beim Hosten der Anwendung auf Legacy-Servern, die in den letzten vier Jahren nicht aktualisiert wurden, bestimmte Einschränkungen haben, können Sie ASP verwenden Stattdessen .NET MVC 4 oder 5.

Arseni Mourzenko
quelle
1
danke MainMa. Mir ist bewusst, dass AngularJS clientseitig und MVC serverseitig ist. Mir ist auch bewusst, dass andere Bibliotheken wie Lenker, Knockoutjs in MVC.NET und Angular in PHP, Java-Anwendungen verwendet werden können. Was mich fragt, ist, warum man beide zusammen benutzt, da beide dasselbe tun, was "MVC" ist, aber einer ist Client-Seite und einer ist Server-Seite. Warum sollten die MVC-Frameworks clientseitig und serverseitig gemischt werden? Können wir keine Anwendung erstellen, die nur eine Angular-Anwendung ist? Oder eine Anwendung, die nur MVC.net-Anwendung ist?
Natalie
@ Natalie: Ich verstehe. Ich habe die Antwort bearbeitet, um mehr Informationen darüber zu liefern. Eine kurze Antwort ist, dass Sie diese beiden Frameworks in Projekten mischen, in denen es sinnvoll ist, sowohl auf Server- als auch auf Clientseite eine bestimmte Struktur zu haben.
Arseni Mourzenko
Können Sie mir zum Beispiel sagen, ob es eine Web-API gibt, die mir Daten zur Verfügung stellt, und ich diese Daten in einem Raster anzeigen möchte. Muss ich die Schleife und das Templating mit Angular oder MVC ausführen? Rufe ich den Web-API-Dienst mit welchem ​​wie auf? Wie entscheiden Sie von Beginn des Projekts an, welchen Weg Sie einschlagen wollen?
Natalie
Ich habe die gleichen Fragen im Kopf. Ich konnte keinen Grund finden, asp.net MVC überhaupt zu verwenden. Ich meine, es sieht so aus, als ob Asp.net Web API auf der Serverseite und Angular auf der Clientseite ausreichen würden. Aber ich dachte zuerst; Web API = Datenzugriffsebene, Asp.Net MVC = Geschäftslogikebene, Angular = Benutzeroberflächenebene. Von der Angular-Seite aus können wir jedoch nur Web-API-Aufrufe durchführen, sodass wir die Asp.Net MVC-Serverseite nicht verwenden können. Ich denke, wir brauchen ein gutes Beispiel, warum wir Asp.Net MVC verwenden müssen.
Salim
9

Wenn Sie Visual Studio verwenden, gibt es eine neue MVC-Website-Vorlage für die Anwendung "Single Page App", die Angular- und MVC Web Api-Controller enthält.

Dies funktioniert gut, da Ihr serverseitiger MVC-Code json-Endpunkte bereitstellt, die der eckige clientseitige Code aufrufen kann.

Zusätzlich können Sie die MVC-Controller verwenden, um die grundlegende HTML-Ansicht oder -Ansichten für Ihre App für einzelne Seiten bereitzustellen. Dies gibt Ihnen die Möglichkeit der serverseitigen Generierung, Autorisierung, Weiterleitung, Fehlerbehandlung usw

Oft möchten Sie eine kleine Menge von HTML- / Javascript-Servern sogar auf einer einzigen App-Seite erstellen, z. B. Endpunkt-URLs für verschiedene Umgebungen, verschiedene Sprachen oder sogar die eine oder andere Authentifizierungsseite, die möglicherweise auf der Serverseite einfacher zu erstellen ist.

Ewan
quelle
1
Beim Erstellen der Standard-SPA-Vorlage in VS 2015 CE werden im Skriptordner Bootstrap, JQuery, Knockout, Reply und Sammy angezeigt, jedoch keine Angulars. Vermisse ich etwas?
TK-421
2

Verwenden Sie 3 Jahre später die ASP.NET-Web-API, um Ihre Daten bereitzustellen, und Angular (js oder neuer), um Ihre App clientseitig zu strukturieren. Wenn Sie eine statische Site erstellen, verwenden Sie einfach ASP.NET MVC.

user441521
quelle