我的数据看起来像:
[
{
"TravelerExtended": {
"ExtendedInt_1": {
"#text": "0",
"Label": "Do you require the hotel has a spa or fitness center?:"
},
"ExtendedInt_2": {
"#text": "0",
"Label": "Do you prefer to be prechecked into your room?:"
},
"ExtendedInt_3": {
"#text": "0",
"Label": "Connecting/Adjoining rooms, when traveling with family?:"
},
然后,我的$范围是:
define(function () {
return function ($scope, $ticket, $person, $http, $el, $app) {
// TODO
$scope.is_loading = true;
var params = {
url: "http://10.100.1.98:81/myidapi.php",
// Any other parameters will be sent as-is
// to your remote web service.
// For example, here we are sending an 'email' parameter:
id: $ticket.id
};
$http.get('DP_URL/agent/misc/proxy', {params: params}).success(function(data) {
$scope.is_loading = false;
$scope.profiles = data;
});
};
});
,当然,我有HTML输出尝试使用各种NG功能:
<div ng-repeat="traveler in profiles">
Extended Profile
<div ng-repeat="profile in traveler.TravelerExtended">
<li ng-repeat-"field in profile.ExtendedInt_1">
{{field.label}} {{field.#text}}
</li>
</div>
</div>
我似乎无法弄清楚如何进入第三级数据。看来初始数据负载可能是畸形的,或者我只是在张开NG重复功能。
ng-repeat
在数组上工作...在粘贴的数据结构中,您只有一个数组(profiles
),其中一个对象(TravelerExtended
),其中有3个对象(ExtendedInt_1, ExtendedInt_2, ExtendedInt_3
)。
要穿越它们,您需要在一个ng-repeat
中工作(因为您只有一个数组)。以下代码可用于您粘贴的数据结构的遍历。
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.records = [
"Alfreds Futterkiste",
"Berglunds snabbköp",
"Centro comercial Moctezuma",
"Ernst Handel",
]
$scope.profiles = [{
"TravelerExtended": {
"ExtendedInt_1": {
"text": "0",
"Label": "Do you require the hotel has a spa or fitness center?:"
},
"ExtendedInt_2": {
"text": "0",
"Label": "Do you prefer to be prechecked into your room?:"
},
"ExtendedInt_3": {
"text": "0",
"Label": "Connecting/Adjoining rooms, when traveling with family?:"
}
}
},
{
"TravelerExtended": {
"ExtendedInt_1": {
"text": "0",
"Label": "2 Do you require the hotel has a spa or fitness center?:"
},
"ExtendedInt_2": {
"text": "0",
"Label": "2 Do you prefer to be prechecked into your room?:"
},
"ExtendedInt_3": {
"text": "0",
"Label": "2 Connecting/Adjoining rooms, when traveling with family?:"
}
}
}
];
/*
for(var i=0; i<$scope.profiles.length; i++){
console.log($scope.profiles[0].TravelerExtended);
console.log($scope.profiles[0].TravelerExtended.ExtendedInt_1);
}
*/
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<div ng-repeat="traveler in profiles">
{{traveler.TravelerExtended.ExtendedInt_1.Label}} {{traveler.TravelerExtended.ExtendedInt_1.text}} <br/>
{{traveler.TravelerExtended.ExtendedInt_2.Label}} {{traveler.TravelerExtended.ExtendedInt_2.text}} <br/>
{{traveler.TravelerExtended.ExtendedInt_2.Label}} {{traveler.TravelerExtended.ExtendedInt_2.text}} <hr/>
</div>
</div>
akber说的是正确的。如果您需要自动循环在对象内部,则可以执行类似的操作:
$http.get('DP_URL/agent/misc/proxy', {params: params}).success(function(data) {
$scope.is_loading = false;
$scope.profiles = formatData(data);
});
formatData(dataObject) {
var dataArray = [];
angular.forEach(dataObject, function(value, key) {
dataArray.push(value);
});
return dataArray;
}