2011-05-12 84 views
6

我是MVC的新手,最近使用Razor視圖引擎啓動了Asp.Net MVC3項目。如何使用Razor顯示動態圖像名稱

目前,我無法用Razor將圖像名稱輸出到html img標籤中。

假設我的模型中有一個Car類,它帶有一個名爲ModelName的字符串屬性。我還有一個包含汽車模型圖像的文件夾,它們以汽車模型命名,這樣我就可以按照慣例通過使用名稱來顯示特定模型的圖像。

從我控制我汽車的集合向下傳遞到我的觀點並執行以下操作以顯示汽車模型的圖像列表:

@foreach (var item in Model) { 
<img src='@item.ModelName.png' /> 
} 

但是,如果我嘗試運行此,我得到的錯誤:

Compiler Error Message: CS1061: 'string' does not contain a definition for 'png' and no extension method 'png' accepting a first argument of type 'string' could be found (are you missing a using directive or an assembly reference?)

我也試過

@foreach (var item in Model) { 
    <img src='@{item.ModelName}.png' /> 
    } 

但是,其結果是:

Compiler Error Message: CS1528: Expected ; or = (cannot specify constructor arguments in >declaration) Source Error:

Line 84: #line default Line 85: #line hidden Line 86: WriteLiteral(".png\' ">\r\n"); Line 88:

我可以圍繞它做:

@foreach (var item in Model) { 
    string imageName = string.Format("{0}.png", item.ModelName); 
    <img src='@imageName' /> 
    } 

但是,這感覺非常笨重,當然必須有一個更好的辦法?

回答

20

你也可以這樣做:

@foreach (var item in Model) 
{ 
    <img src="@(item.ModelName).png" /> 
} 

或者造一個配偶幫助:

public static MVCHtmlString Image<T>(this HtmlHelper helper, string name) 
{ 
    TagBuilder img=new TagBuilder("img"); 
    img.Attributes.Add("src", name+".png"); 
    return new MvcHtmlString(img.ToString()); 
} 

,並用它喜歡:

@foreach (var item in Model) 
{ 
    @Html.Image(item.ModelName) 
} 
+0

啊!這麼簡單,謝謝一堆@Carles – 2011-05-12 06:48:07

2
@foreach (var item in Model._imageList) 
{ 
    <tr> 
     <td> 
      @Html.DisplayFor(modelItem => item.FriendlyName) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.CreateDate) 
     </td> 
     <td> 
      <img src="@Url.Content(item.ImagePath)" alt="Image" /> 
     </td> 
     <td> 
      @Html.ActionLink("Edit", "UploadImageEdit", new { id = item.ImageID }) | 
      @Html.ActionLink("Details", "UploadImageDetails", new { id = item.ImageID }) | 
      @Html.ActionLink("Delete", "UploadImageDelete", new { id = item.ImageID }) 
     </td> 
    </tr> 
} 

這將顯示在圖像保存在文件系統上,但文件路徑是在使用foreach循環時保存在數據庫中。