ASP.NET Core 6/MVC/Razor Sentaksı

Daha önce de söylediğimiz gibi view'lar C# ve HTML kodu içerirler. HTML kodları direkt istemciye gönderilir; C# kodları çalıştırılır, sonucu ilgili yere basılarak istemciye gönderilir. Razor, C# ve HTML kodlarının nasıl birbirine katıştırılacağını belirleyen teknolojidir.

Razor direktifleri

değiştir

Razor direktifleri sadece view'larda kullanılabilir ve view'lara özel anlamları ve işlevleri vardır. Aşağıdaki tabloda en önemli direktifler verilmiştir:

Direktif Açıklama
@model View'ın modelinin tipini belirtmeye yarar.
@using Herhangi bir isim alanını import etmeye yarar.
@page İlgili view'ın bir Razor sayfası olduğunu belirtir.
@section Bir layout section'ını belirtmeye yarar.
@addTagHelper View'da belirli bir tag helper kümesini kullanmamıza izin verir.
@namespace View'ın hangi isim alanına ait olduğunu belirtmeye yarar.
@functions Çoğunlukla Razor sayfalarında kullanılır ve view sınıfına metot ve özellik eklemeye yarar.
@attribute View sınıfına bir attribute ekleme amaçlı kullanılır.
@implements View sınıfının belirli bir arayüzü uygulamasını sağlar.
@inherits View sınıfının ana sınıfını belirtmeye yarar.
@inject View'a bir servisi enjekte etmeye yarar.

İçerik ifadeleri

değiştir

Direktifler soyut belirtimler yapar. Razor'da gerçekten iş yapan ve sayfaya çıktı veren ifadeler içerik ifadeleridir. En önemli içerik ifadeleri aşağıdaki tabloda verilmiştir:

Sıra No İsim Açıklama
1 @<ifade> Belirli bir C# ifadesi çalıştırılır ve sonucu ilgili yere basılır.
2 @if bool döndüren bir ifadenin sonucuna göre ilgili yere basılacak içeriğin belirtilmesi amacıyla kullanılır.
3 @switch Belirli bir değişkenin sahip olacağı değere göre ilgili yere farklı içeriklerden birinin basılması amacıyla kullanılır.
4 @foreach Bir IEnumerable'ın her bir elemanının belirli bir formatta ilgili yere basılmasını sağlar.
5 @{ ... } Bir C# kod bloğu tanımlar.
6 @: Hiçbir HTML kodu ile çevrelenmeyecek ama sayfaya çıktı verilmesi gereken içerikleri belirtmek amacıyla kullanılır.
7 @try Potansiyel olarak çalışma zamanı hatası oluşturabilecek ve yakalanması gereken içeriği belirtmek için kullanılır.
8 @await Sayfaya çıktı verecek işlem asenkron bir işlemse kullanılır.

Şimdi sırasıyla bu tabloda gördüğümüz içerik ifadelerini son ikisi dışında teker teker işleyeceğiz.

1. Bir C# ifadesinin sayfaya basılması

değiştir

Razor'da yapılabilecek en basit işlem basit bir C# ifadesinin çıktısının sayfada ilgili yere basılmasıdır. Örnek:

<tr><th>Name</th><td>@Model.Name</td></tr>
<tr><th>Price</th><td>@Model.Price.ToString("c")</td></tr>

Bu örneğimizde model nesnesinin Name ve Price özellikleri sayfada ilgili yere basılmıştır. Eğer ilgili C# ifadesi boşluk içeriyorsa bütün ifadenin parantez içine alınması gerekmektedir. Örnek:

<tr><th>Tax</th><td>@(Model.Price * 0.2m)</td></tr>

HTML etiketlerinin içerikleri yanında attribute değerleri de C# ifadesi olabilir. Örnek:

<table data-id="@Model.ProductId"></table>

2. Koşullu bir şekilde sayfaya içerik konulması

değiştir

Örnek:

@if (Model.Price > 200) {
    <tr><th>Name</th><td>Luxury @Model.Name</td></tr>
} else {
    <tr><th>Name</th><td>Basic @Model.Name</td></tr>
}

Bu örneğimizde eğer model nesnesinin fiyatı 200'den fazlaysa farklı bir içerik, 200'den azsa farklı bir içerik sayfaya verilecektir. Sayfaya verilecek içeriğin içinde de @ ile başlamak şartıyla C# ifadesi kullanılabileceğine dikkat edin. İstenirse elseif şeklinde yeni koşullar da eklenebilir. Örnek:

@if (Model.Price > 200) {
    <tr><th>Name</th><td>Luxury @Model.Name</td></tr>
} elseif(Model.Price > 100) {
    <tr><th>Name</th><td>Standart @Model.Name</td></tr>
} else {
    <tr><th>Name</th><td>Basic @Model.Name</td></tr>
}

C# programlama dilinde bir if, else if veya else ifadesi tek satır C# kodu içeriyorsa bu içeriğin kümeli parantezler içine alınmasına gerek yoktur. Ancak Razor'da if, elseif ve else ifadelerinin karşılanması durumunda sayfaya verilecek içeriğin belirtilmesi için mutlaka küme parantezleri kullanılmalıdır. Razor'da C#'ta olduğu gibi elseif ve else ifadeleri opsiyoneldir.

3. Belirli bir değişkenin değerine göre sayfaya içerik konulması

değiştir

C#'ta olduğu gibi daha karmaşık koşullu yapularda switch ifadesi kullanılabilir. Örnek:

@switch (Model.Name) {
    case "Kayak":
        <tr><th>Name</th><td>Small Boat</td></tr>
        break;
    case "Lifejacket":
        <tr><th>Name</th><td>Flotation Aid</td></tr>
        break;
    default:
        <tr><th>Name</th><td>@Model.Name</td></tr>
        break;
}

4. Belirli bir ardılın elemanlarının sayfaya yazdırılması

değiştir

C#'ta IEnumerable arayüzünü uygulamış herhangi bir nesne üzerinde foreach döngüsüyle dönülebilir. Aynısı Razor için de geçerlidir ve bir ardılın her bir elemanını sayfaya belirli bir formatta yazdırmaya yarar. Örnek:

<table>
    @foreach (Product p in Model) {
        <tr>
            <td>@p.Name</td><td>@p.Price</td>
        </tr>
    }
</table>

Bu örneğimizde modelin bir Product ardılı olduğu varsayılmıştır. Örneğimiz Product ardılındaki her bir Product'ın Name ve Price özelliklerini tabloda yeni bir satırda olacak şekilde ekrana basmaktadır.

5. C# kod blokları

değiştir

Bazen view tarafında basit bir C# ifadesinin sayfaya basılması dışında şeyler de yapmak isteyebiliriz. Örneğin değişken tanımlamaları, değişkenlere değer atanması, vs. sadece kod bloklarında yapılabilir. Daha genel bir ifadeyle sayfaya çıktı vermeyecek, mantıksal işlem yapacak bütün C# kodları için kod bloğu açmak zorundayız. Örnek:

@{
    decimal average = Model.Average(p => p.Price);
    decimal count = Model.Count();
}
<p>There are @count products in database, with an average price of @average</p>

Bu kodumuz model olarak Product ardılı alındığını varsaymaktadır. C# kod bloğunda average ve count olmak üzere iki değişken tanımlanmış, bu değişkenlerin değerleri daha sonraki HTML kodunda kullanılmıştır.

6. Sayfaya direkt çıktı verme

değiştir

Bazen C# kodu içinde belirli bir yere salt bir metin çıktısı vermek isteyebiliriz. Çoğunlukla verilecek çıktı HTML etiketleri arasında olduğu için şimdi göreceğimiz ifadeyi kullanmaya gerek kalmaz. Ancak bazen bu ifadeyi kullanmak zorunda kalabiliriz. Örneğin daha önce yazdığımız şu kodu göz önüne alalım:

@switch (Model.Name) {
    case "Kayak":
        <tr><th>Name</th><td>Small Boat</td></tr>
        break;
    case "Lifejacket":
        <tr><th>Name</th><td>Flotation Aid</td></tr>
        break;
    default:
        <tr><th>Name</th><td>@Model.Name</td></tr>
        break;
}

Burada tek değişen <td>'lerin içindeki ifade olmasına rağmen biz aynı <tr>, <th> ve <td>'leri tekrar tekrar yazdık. En önemlisi Name sütununu her seferinde tekrar yazdık. Bu ideal bir durum değildir, böyle bir durumda koşulu sadece verinin değiştiği yere taşımak daha mantıklıdır. Şimdi kodumuzu şöyle değiştirelim:

<tr><th>Name</th><td>
    @switch (Model.Name) {
        case "Kayak":
            @:Small Boat
            break;
        case "Lifejacket":
            @:Flotation Aid
            break;
        default:
            @Model.Name
            break;
    }
</td>

Diğer bir deyişle @: ifadesi manuel olarak C# modundan HTML moduna geçmeye yarar.