文件夹中的Ng重复图像 [英] Ng-repeat images in folder

问题描述

我是Angular的初学者，我想对文件夹中的图像进行ng-repeat.我所有的图像都有不同的名称，所以我看不到如何为所有图像制作ngSrc.

I'm a beginner with Angular and I want to make a ng-repeat of images in a folder. All my images have different names so I don't see how I can make a ngSrc for all the images.

希望我很清楚.

推荐答案

您可以尝试这样的操作.

You can try something like this.

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

Grab all the image filenames and store it in a javascript array with in the javascript for your controller. I'm assuming you would be doing this on your server side and return JSON back to client through an API or Service.

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

In you controller, the result would look like this.

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

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

You have many options now. One way is to write a little function that returns the full path and call it from ng-src.

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

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

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

</div>

类似的帖子此处

下次尝试使用JSFiddle或Plunker给出一些代码段，因为它清楚地显示了您要执行的操作.

Try to give some code snippets using JSFiddle or Plunker next time as it would clearly show what you are trying to do.

[更新]

我不知道您在服务器端使用什么语言/框架，但是将所有文件保存在目录中非常容易.下面是分别使用node.js和C#的示例.

I don't know what language/framework you are using on the server side but to get all the files in a directory is very easy. Below are examples using node.js and C# respectively.

http://www.csharp-examples.net/get-目录中的文件/

如何获取所有名称的列表文件是否存在于Node.js目录中?

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

If you are using ASP.NET WEB API, then just return the array back from the Get method in your API Controller, and then call that API from Angular directly.

有关如何执行此操作的示例很多.只要做一些研究，你就可以了.

There are tons of examples on how to do this. Just do some research and you should be fine.

这篇关于文件夹中的Ng重复图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！