Trình trợ giúp MVC - sử dụng @URL cho hình ảnh src?

Question

Tôi đang sử dụng MVC3 và có một trình trợ giúp đơn giản vẽ một hộp với một số văn bản và biểu tượng bên trong cho một ứng dụng trạng thái. Một đoạn mã:

@helper Tile(string ID) 
{ 
<div class="front defaulttile"> 
    <div class="notifybar" id="NotifyBarID" > 
    <img alt="" src="@Url.Content("~/Images/img.jpg")" style="display: inline; margin-right: 5px;" /> 
    <p class="topstatusbartext" id="NotifyBarTextID" >Status bar text</p> 
    </div> 
etc... 

Thật tuyệt vời khi sử dụng @ Url.Content cho hình ảnh src, nhưng tôi gặp phải lỗi không có sẵn. Có cái gì tôi có thể thêm hoặc thay đổi để sử dụng điều này? Tôi không muốn phải sắp xếp đường dẫn và gặp sự cố khi ứng dụng ở trên máy chủ.

Cảm ơn!

Answer 1

Có vẻ như ai đó đã đặt câu hỏi tốt hơn tôi. Xem xét điều này:

In ASP.NET MVC how can I use the Razor @Url.Content() helper from C# code?

Bạn cũng có thể sử dụng @Href bên trong một Helper MVC quá, như thế này:

src="@Href("../../Images/trend_up.png")" (whatever path is relative to the cshtml file) 
-- or -- 
src="@Href("~/Images/trend_up.png")" 

Trên đây là cho MVC3.

Trong MVC4, bạn sẽ có shortcut đẹp này (chú ý ~):

<img id="img1" src="~/Images/trend_up.png" /> 

Nhờ Rick Anderson, Jon Galloway và Eilon Lipton cho sự giúp đỡ.

Answer 2

@helper Tile(string ID,UrlHelper url) 
{ 
<div class="front defaulttile"> 
    <div class="notifybar" id="NotifyBarID" > 
    <img alt="" src="@url.Content("~/Images/img.jpg")" style="display: inline; margin-right: 5px;" /> 
    <p class="topstatusbartext" id="NotifyBarTextID" >Status bar text</p> 
    </div> 
etc... 

Answer 3

Trong MVC4, nó chắc chắn là thú vị để có thể sử dụng các dấu ngã một lần nữa, như đã nêu trong câu trả lời:

src="~/Images/trend_up.png" 

Chỉ rememeber rằng tài liệu tham khảo cho những hình ảnh trong file CSS của bạn sẽ không nhận ra ~ - MVC4 hay không.

Tuy nhiên, đó không phải là vấn đề tương tự, vì tham chiếu tương đối với hình ảnh trong url CSS.
Ví dụ: background: url('../Images/menus/menu-left.png') sẽ liên quan đến vị trí của tệp CSS. Vì vậy, nếu bạn có thể quản lý để có các tập tin CSS ở lại đặt tương đối so với các thư mục ứng dụng khác, bạn đang OK ...