2014-03-25 58 views
0

我有問題得到ng-repeat來演示我的JSON響應,我是AngularJS的新手,所以我相信它是一個新手錯誤:)。我正試圖讓ng-repeat經過ns0:AttributeDetailsns0:Attributes。這裏是JSON數據:ng-repeat與JSON數組一起工作

{"ns0:GetAgentProfile.Response": { 
"xmlns:ns0": "http://URL", 
"ns1:Header": { 
    "xmlns:ns1": "http://URL", 
    "xmlns:ns7": "http://URL", 
    "ns1:Source": null, 
    "ns1:CreatedDateTime": "2014-03-24T09:34:28.339-05:00", 
    "ns1:MessageType": "Request", 
    "ns1:MessageId": null 
}, 
"ns0:ProfileDetails": { 
    "ns0:UserIdentifier":  { 
     "ns0:UserGUID": "2BCF0074-392F-4653-8733-02063C2DBC5C", 
     "ns0:UserName": "Username01" 
    }, 
    "ns0:AttributeDetails": {"ns0:Attribute":  [ 
     { 
      "ns0:Name": "AgentLogin", 
      "ns0:Value": ["Username01"] 
     }, 
     { 
      "ns0:Name": "FullName", 
      "ns0:Value": ["Name, User"] 
     }, 
     { 
      "ns0:Name": "LanguageSpoken", 
      "ns0:Value": ["English|Chinese"] 
     }, 
     {"ns0:Name": "Supervisor"}, 
     { 
      "ns0:Name": "Region", 
      "ns0:Value": ["Region01"] 
     }, 
     { 
      "ns0:Name": "Country", 
      "ns0:Value": ["CO"] 
     }, 
     { 
      "ns0:Name": "ClientAccessGroup", 
      "ns0:Value": ["CountryMobileCCR"] 
     }, 
     {"ns0:Name": "Roles"} 
    ]}, 

這裏是HTML:

<!DOCTYPE html> 
<html ng-app="auth" xmlns="http://www.w3.org/1999/html"> 
<head> 
<title></title> 
<link rel="stylesheet" type="text/css" href="css/bootstrap.css"> 
<script src="js/bootstrap.js"></script> 
<script src="js/angular.js"></script> 
<script src="js/authorization.js"></script> 
</head> 
<body ng-controller="MainCtrl"> 
<div> 
    <div class="container-fluid"> 
     <form class="well"> 
      <label>Username:</label> 
      <input><br><br> 
     <button ng-click="getData()" class="btn btn-primary">Submit</button> 
     <button ng-click="clearData()" class="btn btn-danger">Reset</button> 
     </form> 
    </div> 
    <h1>Response from Service:</h1> 
    <!-- <pre>{{data | json}}</pre> --> 
    <pre> 
    Username: {{data['ns0:GetAgentProfile.Response']['ns0:ProfileDetails'] ['ns0:UserIdentifier']['ns0:UserName']}} <br> 
    Profile Details</pre> 
    <div ng-repeat="Attribute in data">{{ data['ns0:GetAgentProfile.Response']['ns0:ProfileDetails']['ns0:AttributeDetails']['ns0:Attribute']['ns0:Name'] }}</div> 
    </div> 
    </html> 

這裏是JS的控制器獲取數據:

var app = angular.module('auth', []); 

app.factory('authService', function($http) { 
var promise; 
var authService = { 
    async: function() { 
     if (!promise) { 

      promise = $http.get('package.json').then(function (response) { 
      console.log(response); 
      return response.data; 
      }); 
     } 
     return promise; 
    } 
}; 
return authService; 
}); 

app.controller('MainCtrl', function(authService,$scope) { 
    $scope.clearData = function() { 
    $scope.data = {}; 
}; 
$scope.getData = function() { 
    authService.async().then(function(d) { 
     $scope.data = d; 
    }); 
}; 
}); 

我再次爲新手問題道歉。任何援助將不勝感激。

回答

2

深入到你的數組中的repeat指令:

<div ng-repeat="Attribute in data.ns0:GetAgentProfile.Response.ns0:ProfileDetails.ns0:AttributeDetails.ns0:Attribute"> 

現在你可以這樣做:

{{Attribute.ns0:Name}} and {{Attribute.ns0:Value}} 

不知道,如果:將很好地壽玩,可能有逃生者。

+0

所以在div我不會需要數據後的ns0:GetAgentProfile.Response? – Vessaredan

+0

@Vessaredan - Woops錯過了這個屬性,我添加了它! – tymeJV

+0

這是什麼工作:

{{ Attribute['ns0:Name'] }}{{ Attribute['ns0:Value'] }}
非常感謝你的幫助! :) – Vessaredan