如何在angularjs中用多个键值进行ng-apeat？
[英]How to ng-reapeat with multiple key values in angularjs?
问题描述
Hi i have object of multiple keys and values 
嗨，我有多个键和值的对象
The Response object has the follwing : Response对象具有以下特点：
Object
MainID:"589d8ddaf7045b29b5101cdc"
Url:Array[5]
0:Object
_id:"589d8ddaf7045b29b5101cdd"
url:"images/product_images/file-1486720474060.jpeg"
1:Object
_id:"589d8e1d142ef52a4ffb8285"
url:"images/product_images/file-1486720541230.jpeg"
2:Object
_id:"589d8eda142ef52a4ffb8288"
url:"images/product_images/file-1486720730226.jpeg"
This is my angular code : 这是我的角度代码：
$scope.data = response;
And this is my html code : 这是我的html代码：
<div class="add-pic-box1 col-md-3" ng-repeat="datas in data">
<img class="thumb" ng-repeat="img in data.Url" ng-model="add_new_ads_mdl.img_add" imgid = "{{img._id}}" src="{{img.url}}" />
<span><i class="fa fa-times" ng-click="close_img(data.url._id)"></i></span>
</div>
Can anyone help me please , thanks in advance .. 任何人都可以帮我，谢谢。
2 个解决方案
解决方案1
1 2017-02-10 10:26:12
Issue is with your ng-repeat , it should be, The child ng-repeat should have datas instead of data 问题在于您的ng-repeat，应该是，子ng-repeat应该具有数据而不是数据
<div class="add-pic-box1 col-md-3" ng-repeat="datas in data">
<img class="thumb" ng-repeat="img in datas.Url" ng-model="add_new_ads_mdl.img_add" imgid = "{{img.id}}" src="{{img.url}}" />
DEMO 演示
angular.module('webapp', []) .controller('AppCtrl', function($scope) { $scope.data = { "id": 5454554, "Url": [ { "_id": "http://www.bcetupes.info/wp-json/wp/v2/posts/7194", "url": "https://farm4.staticflickr.com/3261/2801924702_ffbdeda927_d.jpg" } ] } ; });
<!DOCTYPE html> <html ng-app="webapp"> <head> <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script> </head> <body ng-controller="AppCtrl"> <div class="add-pic-box1 col-md-3"> <div ng-repeat="img in data.Url" > <h1>{{data.id}}</h1> <img class="thumb" ng-model="add_new_ads_mdl.img_add" imgid = "{{img._id}}" src="{{img.url}}" /> </div> <span><i class="fa fa-times" ng-click="close_img(data.url._id)"></i></span> </div> </body> </html>
解决方案2
0 2017-02-10 10:20:29
In your case you have to get url data in one variable so you get only images. 在您的情况下，您必须在一个变量中获取url数据，以便仅获取图像。 check following example $scope.data = response.Url; 检查以下示例$ scope.data = response.Url;
Url:Array[5]
0:Object
_id:"589d8ddaf7045b29b5101cdd"
url:"images/product_images/file-1486720474060.jpeg"
1:Object
_id:"589d8e1d142ef52a4ffb8285"
url:"images/product_images/file-1486720541230.jpeg"
2:Object
_id:"589d8eda142ef52a4ffb8288"
url:"images/product_images/file-1486720730226.jpeg"**
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.