ASP.NET MVC - Ansichten

Um ASP.NET MVC zu lernen, werden wir eine Internetanwendung erstellen.

Abschnitt 5:Fügen Sie Ansichten hinzu, um die Anwendung anzuzeigen.

Views-Ordner

Views In den Ordnern gespeicherte Dateien sind mit der Anzeige der Anwendung (Benutzeroberfläche) verbunden (HTML-Dateien). Abhängig von der Sprache können die Dateierweiterungen html, asp, aspx, cshtml und vbhtml sein.

Der Views-Ordner enthält einen Ordner für jeden Controller.

Visual Web Developer hat einen Account-Ordner, einen Home-Ordner und einen Shared-Ordner (im Views-Ordner) erstellt.

Der Account-Ordner enthält Seiten zur Registrierung und Anmeldung von Benutzerkonten.

Der Home-Ordner wird verwendet, um Anwendungsseiten wie die Startseite und die "Über"-Seite zu speichern.

Der Shared-Ordner wird verwendet, um Ansichten (Musterseiten und Layoutseiten) zu speichern, die zwischen Kontrollern geteilt werden.

ASP.NET-Dateitypen

Finden Sie die folgenden HTML-Dateitypen im Views-Verzeichnis:

Dateityp Erweiterung
Reines HTML .htm oder .html
Klassisches ASP .asp
Klassisches ASP.NET .aspx
ASP.NET Razor C# .cshtml
ASP.NET Razor VB .vbhtml

Index-Datei

Die Datei Index.cshtml stellt die Startseite der Anwendung dar. Es ist die Standarddatei der Anwendung (Startseiten-Datei).

Schreiben Sie folgenden Inhalt in die Datei:

@{ViewBag.Title = "Startseite";}
<h1 Willkommen bei CodeW3C.com</h1>
<p>Setzen Sie hier den Inhalt der Startseite ein</p>

About-Datei

Die Datei About.cshtml stellt die "Über"-Seite der Anwendung dar.

Schreiben Sie folgenden Inhalt in die Datei:

@{ViewBag.Title = "Über uns";}
<h1>Über uns</h1>
<p>Setzen Sie hier den Inhalt von "Über uns" ein</p>

Führen Sie die Anwendung aus

Wählen Sie Debuggen und starten Sie die Debugging aus dem Debugging-Menü (oder drücken Sie F5).

Ihre Anwendung wird ähnlich aussehen:

Klicken Sie auf "Startseite" und "Über", um zu sehen, wie es läuft.

Herzlichen Glückwunsch

Herzlichen Glückwunsch. Sie haben Ihre erste MVC-Anwendung erstellt.

Anmerkung:Die "Film"-Registerkarte kann immer noch nicht geklickt werden. Wir fügen in einem späteren Kapitel dieses Tutorials den Code für die "Film"-Registerkarte hinzu.