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

Question

我是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'的第一个参数可以找到(你是否缺少using指令或汇编引用？)

我也试过了

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

但结果是:

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

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

我可以做到:

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

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

Answer 1

你也可以这样做:

@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)
}