ng-repeat不顯示數據

-1

我想顯示特定屬性的所有圖像。每個圖像只能屬於1個屬性，1個屬性可以有多個圖像。ng-repeat不顯示數據

我分別檢索Images表和屬性表。要將每個圖像分配給它自己的屬性，我使用如下所示的id。

<div ng-show="tab.isSet(3)"> 
     <h4>Images</h4> 
     <img ng-repeat="img in Images.imagePath| filter : {propertyId: pro.id}" ng-src="{{img}}"/> 
</div>

這兩個表都正在檢索罰款。我正在使用屬性表來顯示其他字段，如價格，描述等，工作正常。但是當我試圖展示圖像時，什麼都沒有出現。

也沒有顯示錯誤！

我使用納克控制器propertyCtrl其中我檢索表作爲數組對象

$http.get("php/retrieveImages.php") 
    .success(function(imageData) { 
      $scope.Images = imageData; 
      console.log(imageData); 
     }).error(function() { 
       $scope.Images="error in fetching data"; 
     });

在PHP：

<?php 
require_once("connection.php"); 
$conn = connectToDb(); 

$query = " SELECT 
      img.imagePath, 
      img.propertyId 
      FROM 
      tbl_images AS img 
      JOIN 
      tbl_property AS pro 
      ON(pro.id=img.propertyId)"; 

$result = mysqli_query($conn, $query) 
     or die("Error in query: ". mysqli_error($conn)); 


    $imageData = array(); 
    while ($row = mysqli_fetch_assoc($result)){ 
     $imageData[] = $row; 
    } 
    echo json_encode($imageData); 
?>

的HTML：

<div ng-controller="propertyCtrl"> 

      <div ng-repeat="pro in property | filter:searchProp | orderBy:Select" > 
        <table class="table"> 
         <thead class="thead-default"> 
         <tr> 
          <th><span class='notbold'>Property Reference Number:</span> {{pro.id}}</th> 
          <th><span class='notbold'>Location:</span> {{pro.location}}</th> 
          <th><span class='notbold'>Property Type:</span> {{pro.propertyType}}</th> 
          <th><span class='notbold'>Commercial Or Residential:</span> {{pro.propertyType2}}</th> 
         </tr> 
         </thead> 
       </table> 
       <section ng-controller="TabController as tab" > 
        <ul class="nav nav-pills"> 
         <li ng-class="{active:tab.isSet(1)}"> 
          <a href ng-click="tab.setTab(1)">Description</a> 
         </li> 
         <li ng-class="{active:tab.isSet(2)}"> 
          <a href ng-click="tab.setTab(2)">Price</a> 
         </li> 
         <li ng-class="{active:tab.isSet(3)}"> 
          <a href ng-click="tab.setTab(3)">Images</a> 
         </li> 
        </ul> 
        <div ng-show="tab.isSet(1)"> 
         <h4>Description</h4> 
         <blockquote>{{pro.description}}</blockquote> 
        </div> 
        <div ng-show="tab.isSet(2)"> 
         <h4>Price</h4> 
         <blockquote> € {{pro.price}}</blockquote> 
        </div> 
        <div ng-show="tab.isSet(3)"> 
         <h4>Images</h4> 
//ng-repeat not working!!! 
<img ng-repeat="img in Images.imagePath| filter : {propertyId: pro.id}" ng-src="{{img}}"/> 
    </div> 
</div>

記錄對象數組Ima GES：

Array[4] 
0:Object 
imagePath:"Images/3D-printed-gun-Liberator-006.jpg" 
propertyId:"8"

記錄對象數組物業：

Array[6] 
0:Object 
$$hashKey: "object:9" 
description:"A lovely flat near university.!!" 
id:"8" 
location:"Rabat" 
locationId:"2" 
price:"401.000" 
propertyType:"Apartment" 
propertyType2:"Commercial" 
propertyTypeId:"1" 
propertyTypeId2:"2"

有人可以解釋爲什麼它不顯示圖像？

注意：檢索的路徑是好的，正如插入正常（src ="Images/img.jpg"）圖像顯示。

來源

2016-12-14 Tropical

讀你之後，我想這scope.Images與所有圖像陣列，所以你應該使用：

<img ng-repeat="img in Images" ng-src="{{img.imagePath}}"/>

你想通過圖像的陣列進行迭代，並使用對象的屬性中NG-SRC。

來源

2016-12-14 16:53:31 Yoleth

img與img.imagePath相同，因爲我違反了在ng-repeat中使用的屬性。是的，範圍圖像是一個包含所有圖像的數組，但並非所有圖像都屬於同一個屬性，所以這就是爲什麼我使用過濾器將每個圖像分配給相應屬性的原因。 – Tropical

該答案無效。 – Tropical

我被過濾不好：

<img ng-repeat="img in Images| filter :pro.id" ng-src="{{img.imagePath}}"/>

這解決了這個問題，過濾器通過唯一的財產ID！

來源

2016-12-15 08:44:26 Tropical

ng-repeat不顯示數據

回答

相關問題