2015-03-12 22 views
22

Xin lỗi rằng tôi không giỏi về mvc asp.net mà tôi muốn thú nhận. Tôi chỉ cần đi qua một viết tốt cho asp.net 5 tính năng mới từ this url.Lợi thế của việc sử dụng Trình trợ giúp thẻ trong ASP.Net MVC 6

Từ đó tôi nghe nói về một thuật ngữ gọi là Tag Helpers in ASP.Net MVC 6 và tôi thấy có người nói trước khi nhà phát triển tạo ra hình thức cách dưới đây:

@model MyProject.Models.Product 

@using (Html.BeginForm()) 
{ 
    <div> 
     @Html.LabelFor(m => p.Name, "Name:") 
     @Html.TextBoxFor(m => p.Name) 
    </div> 
    <input type="submit" value="Create" /> 
} 

và bây giờ mọi người có thể viết mã tương tự với thẻ helper cách dưới đây

@model MyProject.Models.Product 
@addtaghelper "Microsoft.AspNet.Mvc.TagHelpers" 

<form asp-controller="Products" asp-action="Create" method="post"> 
    <div> 
     <label asp-for="Name">Name:</label> 
     <input asp-for="Name" /> 
    </div> 

    <input type="submit" value="Save" /> 
</form> 

Họ sử dụng một số cú pháp mới được gọi là asp-controller, asp-for etc nhưng nó sẽ làm gì? Làm thế nào và tại sao mọi người sẽ được hưởng lợi bằng cách sử dụng cú pháp mới này asp-controller, asp-for etc.

Vì vậy, hãy giúp một số người giúp tôi hiểu khái niệm trợ giúp thẻ mới này và cách nó sẽ giúp cuộc sống của nhà phát triển trở nên dễ dàng hơn. Cảm ơn.

Trả lời

28

Cải tiến quan trọng nhất mà tôi đã thấy cho đến nay là kiểm soát nó đảm bảo trên các phần tử HTML của bạn. Trong khi thuận tiện, những người trợ giúp Html được sử dụng bởi MVC tạo ra vấn đề khi bạn cố gắng làm những thứ mà họ không được xây dựng.

Một ví dụ đơn giản có thể được nhìn thấy khi sử dụng TextBox trong MVC5:

@Html.TextBoxFor(m => p.Name) 

Các đánh dấu HTML kết quả trông giống như:

<input class="form-control" id="Name" name="Name" type="text" value=""> 

Nice và đơn giản. Nhưng nếu bạn muốn thêm thuộc tính giữ chỗ thì sao? Điều gì sẽ xảy ra nếu bạn muốn sử dụng các trạng thái xác nhận của bootstrap? Điều gì nếu bạn có một số thư viện javascript siêu mát mẻ bên thứ 3 mà cần các thuộc tính tùy chỉnh. Không có điều nào trong số này có thể xảy ra trong bản phát hành ban đầu của MVC5. Mặc dù chúng cuối cùng được thêm vào thông qua bản cập nhật dưới dạng htmlAttributes. Ngay cả bây giờ thêm thuộc tính tùy chỉnh là kludgey ở mức tốt nhất.

@Html.TextBoxFor(m => p.Name, 
    new {@class="form-control has-error", placeholder="Enter Name", 
    superCoolFeature="Do something cool"}) 

Mặc dù bạn có thể cho rằng điều này vẫn còn ít mã HTML thẳng hơn, nó không còn là lợi thế đáng kể nữa. Tệ hơn nữa, giải pháp này vẫn không bao gồm dấu gạch ngang trong các thuộc tính khá phổ biến. Nếu bạn cần chúng, bạn bị kẹt với một giải pháp thay thế, chẳng hạn như ActionLink htmlAttributes

Tôi đã đi theo lộ trình sửa những thiếu sót này bằng trình chỉnh sửa tùy chỉnh và thử xây dựng các điều khiển TextBox của riêng tôi. Nó trở nên rõ ràng khá nhanh chóng mà thay thế các mẫu TextBox bao gồm sẽ đòi hỏi rất nhiều công việc. Tồi tệ hơn, các mẫu của bạn phải có kiến ​​thức về bất kỳ tiện ích nào bạn đang thêm vào để sử dụng chúng.

Dường như việc đưa Bootstrap và các công cụ của bên thứ 3 vào MVC đã làm cho nó rõ ràng hơn rằng thiết kế hiện tại có vấn đề với việc mở rộng HTML cần được sửa. Hy vọng rằng việc thực hiện trình trợ giúp thẻ là đủ để chúng ta có thể tránh chúng trong tương lai.

5

Một vài điều tôi suy nghĩ:

  1. Như @ChrisWalter chỉ ra, những người giúp đỡ thẻ cho thẻ HTML một mở/đóng chất lượng.Thay vì chỉ cho phép bạn viết các phương pháp mở rộng cho các mẫu HTML phổ biến, bạn có thể mở rộng một phần tử HTML. Điều này cho phép bạn chọn và kết hợp nhiều tiện ích mở rộng cho mỗi thành phần, thay vì phải chọn giữa chúng.
  2. HTML Người trợ giúp có xu hướng không hoạt động tốt cho các yếu tố cần phải có HTML bên trong được cung cấp làm đối số. Họ đã đưa ra một mô hình thông minh, do đó bạn có thể nói:

    @using (Html.BeginForm(...)){ 
    { 
        <input ... /> 
    } 
    

    Nhưng không có gì là về BeginForm() đó sẽ buộc bạn phải đặt nó trong một tuyên bố using, và không có gì để ngăn cản bạn từ việc sử dụng cấu trúc HTML không chính xác là. (<input> về mặt kỹ thuật isn't allowed để được trực tiếp bên trong một thẻ <form>.)

  3. Điều này mang lại cho chúng tôi một bước đệm chuyển tiếp thực sự dễ dàng vào thế giới Thành phần Web của HTML5. Một thành phần mà bạn viết ngày hôm nay cho jQuery hoặc Bootstrap để nhận và nâng cao có thể có ý nghĩa hơn như một thành phần Agular 2 hoặc Polymer trong một vài năm. Sử dụng cú pháp HTML làm cho nó có thể viết HTML theo cách bạn muốn nó khi nó là một thành phần web, và nó được tự động dịch sang cấu trúc mà nó phải tiếp tục (hoặc cho các trình duyệt cụ thể, sau này).
7

Chưa kể, web của bạn thiết kế sẽ có các thẻ HTML thực để chỉnh sửa mà họ nhận ra để tái thiết kế các trang của bạn. Các nhà thiết kế không cần phải là người lập trình và có đủ để những người này có khả năng theo kịp, nghiên cứu các mục tiêu di chuyển của thông số kỹ thuật HTML5 và CSS3.

Các vấn đề liên quan