Vytvoření a použití pomocné rutiny na webu ASP.NET Web Pages (Razor)

, autor: Tom FitzMacken

Tento článek popisuje, jak vytvořit pomocnou rutinu na webu ASP.NET Web Pages (Razor). Pomocná komponenta je opakovaně použitelná komponenta, která zahrnuje kód a značky k provedení úlohy, která může být zdlouhavá nebo složitá.

Co se naučíte:

  • Jak vytvořit a používat jednoduchou pomocnou rutinu.

Toto jsou ASP.NET funkce představené v tomto článku:

  • Syntaxe @helper .

Verze softwaru použité v kurzu

  • ASP.NET Webové stránky (Razor) 3

Tento kurz funguje také s webovými stránkami ASP.NET 2.

Přehled pomocných rutin

Pokud potřebujete provádět stejné úlohy na různých stránkách webu, můžete použít pomocnou rutinu. ASP.NET webové stránky obsahují řadu pomocných rutin a existuje mnoho dalších, které si můžete stáhnout a nainstalovat. (Seznam předdefinovaných pomocných rutin ve webových stránkách ASP.NET je uvedený v ASP.NET API Quick Reference.) Pokud vám žádný ze stávajících pomocníků nevyhovuje, můžete si vytvořit vlastní pomocníka.

Pomocná rutina umožňuje používat společný blok kódu na více stránkách. Předpokládejme, že na stránce často chcete vytvořit položku poznámky, která je nastavená na rozdíl od běžných odstavců. Poznámka je možná vytvořená jako <div> prvek, který má styl pole s ohraničením. Místo přidání stejného kódu na stránku pokaždé, když chcete zobrazit poznámku, můžete kód zabalit jako pomocnou rutinu. Poznámku pak můžete vložit s jedním řádkem kódu, kam potřebujete.

Použití podobné pomocné rutiny usnadňuje kód na každé z vašich stránek a usnadňuje jeho čitelnost. Usnadňuje také údržbu webu, protože pokud potřebujete změnit vzhled poznámek, můžete změnit revize na jednom místě.

Vytvoření pomocné rutiny

Tento postup ukazuje, jak vytvořit pomocnou rutinu, která vytvoří poznámku, jak je právě popsáno. Toto je jednoduchý příklad, ale vlastní pomocná rutina může obsahovat jakékoli revize a ASP.NET kód, který potřebujete.

  1. V kořenové složce webu vytvořte složku s názvem App_Code. Jedná se o vyhrazený název složky v ASP.NET, kam můžete vložit kód pro komponenty, jako jsou pomocné rutiny.

  2. Ve složce App_Code vytvořte nový soubor .cshtml a pojmenujte ho MyHelpers.cshtml.

  3. Nahraďte existující obsah následujícím kódem:

    @helper MakeNote(string content) {
      <div class="note" 
           style="border: 1px solid black; width: 90%; padding: 5px; margin-left: 15px;">
        <p>
          <strong>Note</strong>&nbsp;&nbsp; @content
        </p>
      </div>
    }
    

    Kód používá syntaxi @helper k deklaraci nového pomocníka s názvem MakeNote. Tato konkrétní pomocná rutina umožňuje předat parametr s názvem content , který může obsahovat kombinaci textu a značek. Pomocník vloží řetězec do textu poznámky pomocí @content proměnné .

    Všimněte si, že soubor má název MyHelpers.cshtml, ale pomocná rutina má název MakeNote. Do jednoho souboru můžete umístit více vlastních pomocných rutin.

  4. Uložte soubor a zavřete ho.

Použití pomocné rutiny na stránce

  1. V kořenové složce vytvořte nový prázdný soubor s názvem TestHelper.cshtml.

  2. Do souboru přidejte následující kód:

    <!DOCTYPE html>
      <head>
        <title>Test Helpers Page</title>
      </head>
      <body>
        <p>This is some opening paragraph text.</p>
    
        <!-- Insert the call to your note helper here. -->
        @MyHelpers.MakeNote("My test note content.")
    
        <p>This is some following text.</p>
      </body>
    </html>
    

    Pokud chcete zavolat pomocnou rutinu, kterou jste vytvořili, použijte @ název souboru, ve kterém se pomocník nachází, tečku a název pomocníka. (Pokud jste měli ve složce App_Code více složek, mohli byste pomocí syntaxe @FolderName.FileName.HelperName zavolat pomocnou rutinu v libovolné úrovni vnořené složky.) Text, který přidáte do uvozovek do závorek, je text, který pomocník zobrazí jako součást poznámky na webové stránce.

  3. Uložte stránku a spusťte ji v prohlížeči. Pomocník vygeneruje položku poznámky přímo tam, kde jste ji volali: mezi dvěma odstavci.

    Snímek obrazovky zobrazující stránku v prohlížeči a způsob, jakým pomocník vygeneroval kód, který umístí pole kolem zadaného textu

Další materiály

Vodorovná nabídka jako pomocná rutina Razor. Tato položka blogu Od Mikea Popea ukazuje, jak vytvořit vodorovnou nabídku jako pomocnou rutinu pomocí značek, šablon stylů CSS a kódu.

Využití HTML5 v ASP.NET pomocných rutin webových stránek pro WebMatrix a ASP.NET MVC3. Tato položka blogu od Sam Abraham zobrazuje pomocníka, který vykresluje element HTML5 Canvas .

The Difference Between @Helpers and @Functions in WebMatrix. Tato položka blogu Od Mikea Brinda popisuje @helper syntaxi a @function syntaxi a to, kdy je použít.