如何使用Razor显示动态图像名称

时间:2011-05-12 06:41:27

标签: asp.net-mvc-3 image razor

我是MVC的新手,最近使用Razor视图引擎启动了Asp.Net MVC3项目。

目前我在使用Razor将图像名称输出到html img标签时遇到了麻烦。

假设我的模型中有一个Car类,其字符串属性名为ModelName。我还有一个包含汽车模型图像的文件夹,它们以汽车模型命名,因此我可以按照惯例通过使用名称显示特定模型的图像。

从我的控制器中,我将一系列汽车传递给我的视图并执行以下操作以显示汽车模型图像列表:

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

但是如果我尝试运行它,我会收到错误:

  

编译器错误消息:CS1061:   'string'不包含定义   'png'并没有扩展方法   'png'接受第一个论点   可以找到'string'类型(是吗?   缺少使用指令或   装配参考?)

我也试过

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

但结果是:

  

编译器错误消息:CS1528:预期;或=(不能在&gt;声明中指定构造函数参数)   来源错误:

     

第84行:#line默认   第85行:#line隐藏线   86:WriteLiteral(“。png \”   “&GT; \ r \ n”);第88行:

我可以通过以下方式解决这个问题:

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

但这感觉很笨重,肯定有一个更好的方法吗?

2 个答案:

答案 0 :(得分: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)
}

答案 1 :(得分: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循环时保存在数据库中。