2

嗨，我正在尝试用两个阵列制作一个中继器，但我不知道该怎么做或是否可能。我想要完成的是得到这个html：

 <ul>
           <asp:Repeater ID="Repeater1" runat="server">
                   <ItemTemplate>
                      <li><a href="#"><img src="images/gallery/thumbs/2.jpg" data-large="<%# Container.DataItem %>" alt="image02" data-description="A plaintful story from a sistering vale" /></a>
                      </li>
                      ...       
                   </ItemTemplate>
            </asp:Repeater>

 </ul>

li 标签必须动态生成。更具体地说，我希望 imgs src 从第二个列表中获取元素，数据大以从第一个列表中获取元素，数据描述从第一个或第二个元素中获取文件名.并为每次迭代生成 li 标签。这是后面的代码：

        string[] original = Directory.GetFiles(Server.MapPath(@"images\gallery\projects\original\"));
        string[] thumbs = Directory.GetFiles(Server.MapPath(@"images\gallery\projects\thumbs\"));

        List<string> originalL = new List<string>();

        foreach (string s in original)
        {
            originalL.Add("images/gallery/projects/original/" + Path.GetFileName(s));
        }
        Repeater1.DataSource = originalL;
        Repeater1.DataBind();

在我使用控件制作标签之前，但使用这个 html 我无法做到这一点。我不知道如何将属性添加到内部 img 标记。如果有人可以帮助我制作控件或给我一些关于如何使中继器采用多个数组的指示，那将有很大帮助。如果可以用控件制作它会更好，但任何解决方案都是好的。提前致谢。

Ps 对不起，我昨晚真的很累。

4

2 回答 2

5

以下代码已经过调试并且可以完美运行！

代码隐藏：

public partial class WebForm1 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        List<Image> ImageList = new List<Image>();

        Image Image1 = new Image();
        Image1.ID = 1;
        Image1.Description = "From off a hill whose concave womb reworded";

        Image Image2 = new Image();
        Image2.ID = 2;
        Image2.Description = "A plaintful story from a sistering vale";

        ImageList.Add(Image1);
        ImageList.Add(Image2);

        Repeater1.DataSource = ImageList;
        Repeater1.DataBind();
    }
}

class Image
{
    public int ID { get; set; }
    public string Description { get; set; }
}

HTML：

<ul>
<asp:Repeater ID="Repeater1" runat="server">
    <ItemTemplate>
        <li><a href="#"><img src="images/gallery/thumbs/<%# DataBinder.Eval(Container.DataItem, "ID") %>.jpg" data-description="<%# DataBinder.Eval(Container.DataItem, "Description") %>" /></a></li>
    </ItemTemplate>
</asp:Repeater>
</ul>

我不确定您将从哪里检索描述，但您可以使用它从目录中获取 ID：

string[] images = Directory.GetFiles(Server.MapPath("~/Images/Gallery/Projects/Original"));
foreach (string s in images)
{
    Image NewImage = new Image();
    NewImage.ID = int.Parse(Path.GetFileNameWithoutExtension(s));
}
于 2013-10-25T01:16:56.403 回答
1

这就是我将如何做到的。

首先，我要添加一个类：

public class MyImage
{
    public string ImageThumb { get; set; }
    public string ImageOriginal { get; set; }
    //Add other properties if needed
}

在我的页面中，每当我需要对转发器进行数据绑定时，我都会调用一个名为 DataBind 的方法。这是 DataBind 方法：

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        DataBind();
    }
}
private void DataBind()
{
    string[] original = Directory.GetFiles(Server.MapPath(@"images\gallery\projects\original\"));
    string[] thumbs = Directory.GetFiles(Server.MapPath(@"images\gallery\projects\thumbs\"));

    List<MyImage> originalL = new List<MyImage>();

    for(int i = 0; i < original.Length; i++)
    {
        if (i < thumbs.Length)
        {
            MyImage img = new MyImage();
            img.ImageOriginal = string.Format("images/gallery/projects/original/{0}", Path.GetFileName(original[i]));
            img.ImageThumb = string.Format("images/gallery/projects/thumbs/{0}", Path.GetFileName(thumbs[i]));
            //Add other properties if needed
            originalL.Add(img);
        }                
    }
    Repeater1.DataSource = originalL;
    Repeater1.DataBind();
}

现在我的中继器有一个数据源，它是 List。我可以在我的标记中获取所有属性。我的中继器看起来像这样：

<asp:Repeater ID="Repeater1" runat="server">
    <HeaderTemplate>
        <ul>
    </HeaderTemplate>
    <ItemTemplate>
        <li><a href="#">
            <img src='<%#Eval("ImageThumb") %>'
                data-large='<%#Eval("ImageOriginal") %>' alt="image02"
                data-description="A plaintful story from a sistering vale" /></a>
        </li>
    </ItemTemplate>
    <FooterTemplate>
        </ul>
    </FooterTemplate>
</asp:Repeater>

当然，我会在 MyImage 类中添加 alt 和数据描述的属性，并在我的转发器中使用它们。

于 2013-10-26T02:10:17.110 回答