在Razor C＃中动态使用模型变量名称

Question

我有一个模型，其中有四个变量，即： Image1 ， Image2 ， Image3和Image4

我试图使用for循环在视图中放置四个<img>元素。 这些元素的src属性应为src = "\\Images\\@Model.Image1" ， src = "\\Images\\@Model.Image2" ，依此类推。

那么，有没有办法在for循环中执行此操作？

我现在所拥有的：

@for (int i = 1; i <= 4; i++)
{
    <img src="\Images\@Model.ImagePath1" id="image@(i)" width="150px" height="100px" />
}

谢谢 ：）

Answer 1

如果您不想更改Model类，则可以在视图中执行以下操作：

@{
    var images = new string[]
    {
        Model.Image1, Model.Image2, Model.Image3, Model.Image4,
    };
}

然后在HTML中：

<div>
    @foreach (var image in images)
    {
        <img src="\Images\@image" />
    }
</div>

Answer 2

您在这里有多个选择。 你可以：

我的首选是将它们保存在列表中

public class ViewVM 
{
    public List<string> ImageNames = new List<string>();
    public ViewVM()
    {
        ImageNames.Add("image1.png");
        ImageNames.Add("image2.png");
        ImageNames.Add("image3.png");
        ImageNames.Add("image4.png");
    }
}

然后在您看来

@for (int i = 0; i < Model.ImageNames.Length; i++) 
{
    <img src="\Images\@imageName" id="image@(i)" width="150px" height="100px"/>
}

但是，如果要避免使用列表，则可以将所有图像存储在数组中，如下所示： public string[] imageNames = { image1, image2, image3, image4 };

然后您认为以相同的方式遍历它们。

Answer 3

我将首先为图像创建一个视图模型，如下所示：

public class ImageData {
    public int ImageId {get;set;}
    public string Url {get;set;}
    public string Alt {get;set;}
}

然后，我将像这样为页面创建一个ViewModel

public class PageData {
    public PageData(){
        Images = Images ?? new List<ImageData>();
    }

    // Some other other properties here if you want or need

    public List<ImageData> Images {get;set;}
}

在视图中：

foreach (var image in @Model.Images) {
    <img src="\Images\@image.Url" id="@image.ImageId" width="150px" height="100px" />
}