imported>Import: Version 185

2026-02-17T22:43:52Z

Version 185

Neue Seite

''Hinweis: Diese Inhalte wurden mit Unterstützung von Künstlicher Intelligenz erstellt und redaktionell überprüft (Transparenzhinweis gemäß Art. 50 EU AI Act).''
----

Basierend auf der Analyse von ''start.txt'' enthält dieses Dokument Tutorials und Erklärungen zu den Kernkonzepten von ASP.NET Core MVC, einschließlich Architektur, Views, Razor-Syntax, Datenübergabe und der Erstellung wiederverwendbarer Komponenten.

== MVC Architektur ==

'''Model-View-Controller (MVC)''' ist ein Entwurfsmuster, das eine Anwendung in drei logische Hauptkomponenten unterteilt:

=== 1. Model (Modell) ===

Repräsentiert die Daten und die Geschäftslogik der Anwendung.

* '''Business Model (Domänenmodell)''': Repräsentiert reale Entitäten (z. B. Produkt, Kunde) und die Kerngeschäftslogik/-validierung.
* '''View Model''': Ein maßgeschneidertes Modell, das speziell für eine View entworfen wurde. Es kann Daten aus mehreren Geschäftsmodellen aggregieren oder UI-spezifische Eigenschaften enthalten.

=== 2. View (Ansicht) ===

Verantwortlich für das Rendern der Benutzeroberfläche (UI).

* Typischerweise definiert in ''.cshtml''-Dateien unter Verwendung der Razor-Syntax.
* Generiert dynamisch HTML basierend auf den vom Controller bereitgestellten Daten.

=== 3. Controller (Steuerung) ===

Arbeitet als Vermittler zwischen dem Model und der View.

* Empfängt Benutzereingaben (HTTP-Anfragen).
* Interagiert mit dem Model, um Operationen durchzuführen oder Daten abzurufen.
* Wählt die geeignete View aus, um die Antwort zu rendern.

=== Ablauf der Ausführung ===

# '''Routing''': Die Anfrage wird an einen bestimmten Controller und eine Action-Methode weitergeleitet.
# '''Model Binding''': Daten aus der Anfrage werden extrahiert und in Parameter umgewandelt.
# '''Model Validation''': Daten werden gegen im Model definierte Regeln validiert.
# '''Controller Action''': Logik wird ausgeführt (z. B. Datenbankaufrufe).
# '''View Selection''': Der Controller wählt eine View aus und übergibt ihr Daten (oft ein Model oder ViewModel).
# '''Rendering''': Die View verarbeitet die Daten und generiert HTML.
# '''Response''': Valides HTML wird an den Client zurückgesendet.

=== MVC aktivieren ===

In ''Program.cs'' wird der MVC-Service registriert:

<syntaxhighlight lang="csharp">builder.Services.AddControllersWithViews();</syntaxhighlight>
Dies aktiviert die Controller-Erkennung, die Razor View Engine, Model Binding und Validierung.

-----

== Views in ASP.NET Core ==

Views sind die Präsentationskomponente der MVC-Anwendung.

* '''Ort''': Konventionsgemäß befinden sich Views in ''Views/[ControllerName]/[ActionName].cshtml''.
* '''Funktion''': Sie führen Daten (vom Model/ViewData) mit HTML-Vorlagen zusammen.
* '''ViewResult''': Eine Controller-Action gibt typischerweise ein ''ViewResult'' unter Verwendung der ''View()''-Hilfsmethode zurück.

<syntaxhighlight lang="csharp">public IActionResult Index()
{
// Sucht standardmäßig nach Views/Home/Index.cshtml
return View();
}</syntaxhighlight>

-----

== Razor View Engine ==

Razor ist die Markup-Syntax, die in ASP.NET Core Views verwendet wird, um C#-Code in HTML einzubetten.

=== Wichtige Syntax-Elemente ===

* '''Code-Blöcke''': <code>@{ ... }</code> für mehrzeilige C#-Ausführung.
* '''Ausdrücke''': <code>@variable</code> oder <code>@(ausdruck)</code>, um Werte auszugeben.
* '''Literale''': <code>@:</code> oder <code><text>...</text></code>, um rohen Text innerhalb von Code-Blöcken auszugeben.

=== Kontrollfluss ===

Razor unterstützt Standard-C#-Kontrollflussstrukturen:

'''If/Else''':

<pre class="razor">@if (Model.IsActive)
{
<p>Aktiv</p>
}
else
{
<p>Inaktiv</p>
}</pre>
'''Schleifen (Loops)''':

<pre class="razor">@foreach (var item in Model.Items)
{
<li>@item.Name</li>
}</pre>
'''Switch''':

<pre class="razor">@switch (Model.Status)
{
case Status.Pending:
<span>Ausstehend...</span>
break;
case Status.Complete:
<span>Erledigt!</span>
break;
}</pre>

-----

== Lokale Funktionen in Razor ==

Sie können wiederverwendbare C#-Funktionen direkt innerhalb einer Razor-View unter Verwendung des <code>@functions</code>-Blocks definieren. Dies kapselt Logik, die spezifisch für diese View ist.

'''Syntax''':

<pre class="razor">@functions {
public string FormatDate(DateTime date)
{
return date.ToString("yyyy-MM-dd");
}
}</pre>
'''Verwendung''':

<pre class="razor"><p>Datum: @FormatDate(DateTime.Now)</p></pre>
'''Vorteile''':

* Hält view-spezifische Logik zusammen.
* Reduziert Code-Duplizierung innerhalb einer einzelnen View.
* Kann auf andere Mitglieder zugreifen, die im <code>@functions</code>-Block definiert sind.

-----

== Html.Raw() ==

Standardmäßig kodiert Razor alle String-Ausgaben, um XSS (Cross-Site Scripting)-Angriffe zu verhindern. <code>Html.Raw()</code> wird verwendet, um einen String '''ohne''' Kodierung zu rendern.

'''Verwendung''':

<pre class="razor">@{
string htmlContent = "<strong>Fetter Text</strong>";
}
@Html.Raw(htmlContent)</pre>
'''Warnung''':

* '''Sicherheitsrisiko''': Verwenden Sie dies nur mit vertrauenswürdigen Daten. Verwenden Sie <code>Html.Raw()</code> niemals mit Benutzereingaben, es sei denn, diese wurden streng bereinigt (sanitized), da dies die Anwendung für XSS-Angriffe öffnet.

-----

== ViewData und ViewBag ==

Mechanismen, um kleine Datenmengen vom Controller an die View zu übergeben.

=== ViewData ===

* Typ: ''ViewDataDictionary'' (Schlüssel-Wert-Dictionary).
* Erfordert Typumwandlung (Casting) für komplexe Typen.
* '''Verwendung''':

<syntaxhighlight lang="csharp">// Controller
ViewData["Title"] = "Startseite";

// View
<h1>@ViewData["Title"]</h1></syntaxhighlight>
=== ViewBag ===

* Typ: ''dynamic''.
* Ein Wrapper um ''ViewData''.
* Keine Typumwandlung erforderlich (wird zur Laufzeit geprüft).
* '''Verwendung''':

<syntaxhighlight lang="csharp">// Controller
ViewBag.Title = "Startseite";

// View
<h1>@ViewBag.Title</h1></syntaxhighlight>
'''Best Practice''': Verwenden Sie ''Streng typisierte Views'' (ViewModels) für Hauptdaten. Verwenden Sie ViewData/ViewBag nur für kleine, nebensächliche Daten (wie Seitentitel).

-----

== Streng typisierte Views ==

Binden Sie eine View direkt an eine spezifische Model-Klasse. Dies bietet '''IntelliSense''', '''Typsicherheit''' und Überprüfung zur Kompilierzeit.

'''Syntax''':

# Definieren Sie den Modelltyp oben in der View:

<pre class="razor">@model MyProject.Models.Person</pre>
# Greifen Sie über die <code>Model</code>-Eigenschaft auf Daten zu:

<pre class="razor"><p>Name: @Model.Name</p></pre>
'''Controller''':

<syntaxhighlight lang="csharp">public IActionResult Details()
{
var person = new Person { Name = "John" };
return View(person);
}</syntaxhighlight>
'''View Models''': Es ist üblich, spezifische Klassen (View Models) zu erstellen, die Daten aus mehreren Entitäten aggregieren oder Daten speziell für die View formatieren.

<syntaxhighlight lang="csharp">public class PersonProductViewModel
{
public Person Person { get; set; }
public Product Product { get; set; }
}</syntaxhighlight>

-----

== ViewImports.cshtml ==

Eine spezielle Datei, die im ''Views''-Ordner platziert wird, um gemeinsame Direktiven für alle Views in diesem Ordner (und Unterordnern) zu behandeln.

'''Häufige Verwendungen''':

* '''Namespaces''': <code>@using MyProject.Models</code> (damit Sie es nicht zu jeder View hinzufügen müssen).
* '''Tag Helpers''': <code>@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers</code>.
* '''Layouts''': Definieren eines Standard-Layouts.

'''Beispielinhalt''':

<pre class="razor">@using MyProject
@using MyProject.Models
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers</pre>
Es beachtet die Hierarchie: Eine ''_ViewImports.cshtml'' in einem Unterordner (''Views/Home/_ViewImports.cshtml'') überschreibt oder ergänzt die Einstellungen der Root-''Views/_ViewImports.cshtml''.

-----

== Geteilte Views (Shared Views) ==

Views, die über mehrere Controller hinweg wiederverwendbar sind.

* '''Ort''': ''Views/Shared/''

'''Häufige Typen''':

# '''Layouts''' (''_Layout.cshtml''): Definiert die gemeinsame Struktur (Header, Footer, Referenzen) für die App.
# '''Partial Views''' (''_PartialName.cshtml''): Wiederverwendbare UI-Komponenten (z. B. eine Login-Box, ein Navigationsmenü).

'''Erkennung''': Wenn ein Controller <code>View("MyView")</code> zurückgibt, sucht ASP.NET Core in:

# ''Views/[Controller]/MyView.cshtml''
# ''Views/Shared/MyView.cshtml''

Dieser Fallback-Mechanismus ermöglicht es Ihnen, globale Views im ''Shared''-Ordner zu definieren.

----
''Hinweis: Diese Inhalte wurden mit Unterstützung von Künstlicher Intelligenz erstellt und redaktionell überprüft (Transparenzhinweis gemäß Art. 50 EU AI Act).''

Webframeworkk/ASP.NET Core/Razor Views - Versionsgeschichte

imported>Import: Version 185