2016-06-21 131 views
0

在angularjs.How蔭新手顯示使用angularjs.Below HTML的JSON是代碼解析JSON數組中AngularJS

var app = angular.module('myapp', []); 
app.controller('myctrl', function($scope, $http) { 
    $http.get("http://localhost:8080/xyz").then(function (response) { 

    }); 
}); 

Reponse is : 

[ 
    { 
    "city": "animal" 
    }, 
    { 
    "city": "bird" 
    } 
] 

回答

2

在你的控制器,你應該你的JSON分配到一個範圍:

app.controller('myctrl', function($scope, $http) { 
    $scope.myArray = []; 
    $http.get("http://localhost:8080/xyz").then(function (response) { 
     $scope.myArray = response; 
    }); 
}); 

然後,在你看來,你可以這樣做:

<div ng-controller="myctrl"> 
    <ul ng-repeat="obj in myArray"> 
     <li>{{obj.city}}</li> 
    </ul> 
</div> 
+0

我已經試過這樣的,但頁面是空白 – Teja

1

使用ng-repeat這樣。

<div ng-repeat="t in test"> 
    <span>{{t.city}}</span> 
</div> 

plunker here

+0

在Plunker其顯示,但在我的網頁中沒有顯示。我檢查了兩次JSON鏈接給它的響應。但數據不顯示 – Teja

+0

分享你的代碼。用html和js –

+0

編輯你的問題,我可以看到你的代碼。 –

0

使用下面的代碼,這可能幫助你。

這裏的響應是一個字符串值。

0

試試這個 其中的記錄是這樣的..

{"records":[{"ID":"235","user_id":"2","project_id":"186","project_cid":"2900669120142632939","imagePath":"media/pano/sv_02a29.jpg","ImageName":"1.jpg"},{"ID":"236","user_id":"2","project_id":"186","project_cid":"2900669120142632939","imagePath":"media/pano/sv_f0f59.jpg","ImageName":"253.jpg"},{"ID":"239","user_id":"2","project_id":"186","project_cid":"1997319193267363957","imagePath":"media/pano/sv_6536f.jpg","ImageName":"PANOCLOUD_meta.jpg"},{"ID":"240","user_id":"2","project_id":"186","project_cid":"6736594884768838469","imagePath":"media/pano/sv_898ca.jpg","ImageName":"Boscolo Hotel Budapest.jpg"}]} 



$http.get("moderatorData.php").then(function (response) { 
       $scope.panoramas = response.data.records; 
      }); 

然後打印使用這樣

<li class="align" ng-repeat="pano in panoramas> 
<img ng-src="{{pano.imagePath}}" style="height: 90px;" /> 
</li>