Ng-在文件夹中重复图像

Question

我是Angular的初学者，我想在文件夹中对图像进行重复。我的所有图像都有不同的名称，所以我看不出如何为所有图像制作ngSrc。

希望我足够清楚。

Answer 1

你可以尝试这样的事情。

抓取所有图像文件名，并将其存储在javascript数组中，并在javascript中为您的控制器存储。我假设您将在服务器端执行此操作，并通过API或服务将JSON返回给客户端。

在您的控制器中，结果将如下所示。

$scope.myImages = ["image1.jpg", "image2.jpg"];

你现在有很多选择。一种方法是编写一个返回完整路径并从ng-src调用它的小函数。

$scope.getImagePath = function(imageName) {
return "http://yoursite/location/" + imageName;
};

<div ng-repeat="myImage in myImages">

<img ng-src="{{getImagePath(myImage)}}"/>

</div>

类似文章here

下次尝试使用JSFiddle或Plunker提供一些代码片段，因为它会清楚地显示您要执行的操作。

<强> [更新]

我不知道您在服务器端使用的语言/框架，但是获取目录中的所有文件非常简单。以下是分别使用node.js和C＃的示例。

http://www.csharp-examples.net/get-files-from-directory/

How do you get a list of the names of all files present in a directory in Node.js?

如果您使用的是ASP.NET WEB API，那么只需从API控制器中的Get方法返回该数组，然后直接从Angular调用该API。

有很多关于如何做到这一点的例子。做一些研究，你应该没事。