gpt4 book ai didi

javascript - 在页面上显示json数组数据

转载 作者:行者123 更新时间:2023-12-03 03:24:12 25 4
gpt4 key购买 nike

我有一个获取 json 的 post 函数。

我想打印出所有内容

max_slotsbase_imagec_name 因为它们位于数组中,所以我尝试循环保存值以在 HTML 中使用.

我这样做对吗?如果不是,最好的方法是什么?

目标

在我的html中显示json数组post的结果

我正在尝试

$scope.c_name = [0];
$scope.GetData = function () {
$http({
url: "http://www.ccuktech.co.uk/ccuploader/campaigns/getCampaign",
method: "POST",
date: {},
headers: {'Content-Type': 'application/json'}
}).then(function (data) {
// success
console.log('you have received the data ');
console.log(data);
// $scope.base_image = response.base_image; $scope.c_name = response.c_name;
$scope.c_name = data.data.c_name;
// for(var i = 0; i < c_name.length; i++) {
// var obj = c_name[i];
//
// console.log(obj.id);
// }
// $scope.max_slots = data.data.max_slots;
// $scope.slot_image = data.slots.base_image;
// console.log($scope.c_name);
}, function (response) {
// failed
console.log('failed getting campaigns goo back to log in page.');
console.log(response);
});
};

我的 HTML

<body ng-app='myApp'>
<h2>name</h2>:
{{c_name}}

<h2>max slots</h2>:
{{max_slots}}

<h2>image</h2>:
{{base_image}}
</body>

JavaScript

 $scope.GetData = function () {
$http({
url: "http://www.####.co.uk/####/####/####",
method: "POST",
date: {},
headers: {'Content-Type': 'application/json'}
}).then(function (data) {
// success
console.log('you have received the data ');
console.log(data);
// $scope.base_image = response.base_image; $scope.c_name = response.c_name;
// $scope.c_name = data.data.c_name;
for(var i = 0; i < c_name.length; i++) {
var obj = c_name[i];

console.log(obj.id);
}
// $scope.max_slots = data.data.max_slots;
// $scope.slot_image = data.slots.base_image;
// console.log($scope.c_name);
}, function (response) {
// failed
console.log('failed getting campaigns goo back to log in page.');
console.log(response);
});
};

$scope.GetData();

console.log(数据)结果

enter image description here

最佳答案

因为 API 响应中的 data 是一个数组。您不能仅使用

检索值

尝试将 $scope.c_name = data.data.c_name; 更改为 $scope.c_name = data.data[0].c_name; 等等。

或者

$scope.responseData = data.data[0];

并在您的html

<body ng-app='myApp'>
<h2>name</h2>:
{{responseData.c_name}}

<h2>max slots</h2>:
{{responseData.max_slots}}

<h2>image</h2>:
{{responseData.base_image}}
</body>

编辑:考虑data数组中出现多个元素的可能性

$scope.responseData = data.data;

在 HTML 中:

<body ng-app='myApp'>
<div ng-repeat="data in responseData">
<h2>name</h2>:
{{data.c_name}}

<h2>max slots</h2>:
{{data.max_slots}}

<h2>image</h2>:
{{data.base_image}}
</div>
</body>

关于javascript - 在页面上显示json数组数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46424596/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com