Question

我想使用foreach循环遍历数组来填充aspx页面中的amp-carousel。我想通过一个例子来了解这是否可行。我已经尝试使用amp-list和amp-carousel。我明白不起作用。

这是我试过的

     <amp-list class="mx1 md-mxn1" [src]="'api/' + products.filter + '-' + products.category + '-products.json'" src= some.json height="400" width="300" layout="responsive">
<template type="amp-mustache">
   <amp-carousel height="200" layout="fixed-height" type="carousel">
   {{#Images}}
       <amp-img src="{{ImageUrl}}" layout="fixed" width="100" height="100" alt="{{AlbumName}}"></amp-img>
   {{/Images}}
   </amp-carousel>
 </template>

Answer 1

好的，所以你提到这些数据来自数据库。例如，假设您从数据库中获取了这些数据，并根据名为AmpImage的类使用它来填充C＃模型对象列表。

AmpImage类看起来像这样：

public class AmpImage
{
  public string ImageURL { get; set; }
  public string AlbumName { get; set; }
}

然后在您的控制器操作（呈现您要在其中显示此轮播的视图的操作）中，您将从数据库中获取数据并将其传递给视图。假设您的视图可能已经定义了其他模型，我们会将此数据添加到ViewBag中，以便视图中的Razor代码可以使用它。

List<AmpImage> images = //...whatever code is needed to fetch the image records from the DB and populate the list
ViewBag.AmpImages = images;

//rest of your action method code goes here

最后在View（.cshtml文件）本身中，您可以遍历图像列表并呈现必要的HTML以显示轮播：

<amp-carousel height="200" layout="fixed-height" type="carousel">
    @foreach (AmpImage img in ViewBag.images) {
       <amp-img src="@img.ImageURL" layout="fixed" width="100" height="100" alt="@img.AlbumName"></amp-img>
   }
</amp-carousel>

希望你能看到如何在Razor中创建foreach循环，以及如何使用变量名前的@符号将C＃数据中的值注入到发送到浏览器的HTML中。

是否可以使用带有放大器旋转木马的foreach循环

1 个答案: