Patrick Westerhoff adesso AG

Mit Tag Helpers lassen sich relativ einfach HTML-Elemente um Funktionalitäten erweitern oder sogar eigene Elemente erstellen. Dabei gibt es viele Möglichkeiten, dynamische Funktionalitäten unterzubringen oder komplexe Ausgabestrukturen zu abstrahieren.

Mit ASP.NET Core MVC lernt Razor einen neuen Trick: Die neuen Tag Helpers sind in die HTML-Syntax eingebettet und erlauben es, HTML-Elemente um Funktionen zu erweitern oder ganz neue Elemente zu definieren. Dieser Artikel zeigt anhand von Beispielen, was diese neue Technologie ermöglicht und wie eigene Tag Helpers entwickelt werden können.

In früheren Versionen von ASP.NET MVC wurden dynamische Funktionalitäten in Views durch so genannte HTML Helpers ermöglicht. Typische Beispiele sind Html.BeginForm oder Html.ActionLink. HTML Helpers sind Methoden, die im einfachsten Fall einfach nur einen HTML-Text zurückgeben, der dann in die View eingebettet wird. Somit erlauben sie, komplexe Logik zur Generierung von HTML in einfache Methodenaufrufe zu abstrahieren. Beispielsweise erzeugt die Razor-Syntax @Html.ActionLink(„Beispiel“, „Index“, „Home“) einen Link mit dem Linktext Beispiel zur Index-Route des HomeControllers. Das Erstellen von eigenen HTML Helpers ist daher ein einfacher Prozess: Das Anlegen einer Extension-Methode für den Typ HtmlHelper reicht, um die Methode auf dem View-Objekt Html in Razor zur Verfügung zu stellen:

public static IHtmlString Example(this HtmlHelper helper) {
  return new HtmlString("Dies ist ein <strong>Beispiel</strong>.");
}

Und schon kann die Methode in einer View mit @Html.Example() benutzt werden.
Dadurch, dass HTML Helpers aber nur einfache Methoden sind, ist man bei der Nutzung immer gezwungen, die Methode über die Razor-Syntax aufzurufen. Das ist allgemein kein Problem, kann aber bei komplexeren Strukturen zu einer sehr codelastigen Struktur führen – beispielsweise bei Html.BeginForm, das in ein using-Konstrukt geschachtelt werden muss. Die wiederholte Verwendung solcher Kontrollstrukturen sorgt für einen gewissen Stilbruch innerhalb des HTML-Markups. Insbesondere für Frontend-Entwickler oder Designer ist das eine nicht zu unterschätzende Hürde.

Mit Tag Helpers in ASP.NET Core und ASP.NET Core MVC bietet Razor nun die Möglichkeit, eigenes Verhalten in die HTML-Struktur zu integrieren. Dabei ähneln sie durch ihre Integration in die Syntax ein wenig klassischen ASP.NET-Server-Controls. Allerdings sind sie deutlich leichtgewichtiger zu benutzen und erlauben es nicht nur, komplett eigene Tags zu erstellen, sondern auch existierende Tags um dynamische Funktionalitäten zu erweitern.

Den vollständigen Artikel lesen Sie in der Ausgabe:

Windows Developer 8.16 - "Apps ohne Grenzen"

Alle Infos zum Heft
252340Die Zukunft von Razor in ASP.NET Core
X
- Gib Deinen Standort ein -
- or -