在angularjs中显示嵌套数组中的第一个图像

时间:2017-05-03 04:31:21

标签: html angularjs

这是我的json。我只需要在我的imageview中显示第一张图片。我尝试使用{{p.url}}来获取图像。但它不能正常工作。

 [{

        "comment": "",
        "adoptId": null,
        "images": [
          {
            "id": 4,
            "name": "3_1.jpg",
            "url": "Content\\RacePictures\\YRMTH-2017-04-15-HT09.jpg"
          },
          {
            "id": 5,
            "name": "3_2.jpg",
            "url": "Content\\RacePictures\\YRMTH-2017-04-15-HT09.jpg"
          }
        ]

HTML

    <div class="" ng-repeat="d in photos">
     <div class="col-md-6" >
    <div ng-repeat="p in d.images">
    <img ng-src="http://localhost:20513/{{p.url}}" />
  </div>

角度控制器

    var httpRequest = $http({
                method: 'GET',
                url: urls.api + 'Library/treeImages/Filter/' + images,
      }) .success(function (data, status) {
    $scope.photos = angular.fromJson(data);
                            }
)
}

2 个答案:

答案 0 :(得分:2)

<div class="" ng-repeat="d in photos">
   <div class="col-md-6" >
       <img ng-src="http://localhost:20513/{{d.images[0].url}}" />
   </div>
</div>

试试这个

答案 1 :(得分:1)

只需删除ng-repeat并按索引

访问图像数组
<div class="" ng-repeat="d in photos">
     <div class="col-md-6" > 
    <img ng-src="http://localhost:20513/{{d.images[0].url}}" />
 </div>