Показать массив объектов Json на экране - PullRequest
0 голосов
/ 06 июня 2018

Я успешно выполнил запрос и собрал свои данные в массив, содержащий несколько объектов Json.

Но моя проблема заключается в том, как отобразить этот массив на экране при запуске URL-адреса функции облака?

Вот мой код

let returnArr = [];
...
...
...

let result:PendingTransaction = {
                               powerpalUser_id: userID,
                               transaction_id: fn.key,
                               transaction_points: rewardTransaction.transaction_points,
                               transaction_status: rewardTransaction.transaction_status,
                               transaction_date: rewardTransaction.transaction_date,
                               transaction_recipient: rewardTransaction.transaction_recipient
                           };

 returnArr.push(result);

 response.status(200).json(returnArr);

1 Ответ

0 голосов
/ 07 июня 2018

Вы можете сделать следующее:

В облачной функции вернуть returnArr, как показано ниже:

response.status(200).send(returnArr);

И на вашей веб-странице вы получите объект JavaScript, где массивreturnArr будет находиться в свойстве data этого объекта.

Ниже приведен пример веб-страницы, которая вызывает функцию Cloud и печатает в консоли с JavaScript некоторые значения элементов массива.,

Вы можете делать все, что вам нужно в этом JavaScript, например: заполнять таблицу, создавать элементы div для каждого элемента и писать содержимое, заполнять раскрывающийся список и т. Д.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>SO example</title>

    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>

</head>
<body>

<script>

    axios.get('https://us-central1-myprojectname.cloudfunctions.net/date')
        .then(function (response) {

            results = response.data;  // Array

            for (var key in results) {
                if (results.hasOwnProperty(key)) {
                    // Here use the results object as you wish with results[key].property, as illustrated below with the console.log()
                    console.log(key + " -> " + results[key].powerpalUser_id + " - " + results[key].transaction_points  + " - " + results[key].transaction_status);
                }
            }

        })
        .catch(function (error) {
            console.log(error);
        });


</script>

</body>
</html>

Обратите внимание, что я использую библиотеку Axios для вызова облачной функции HTTPS, но, конечно, вы можете использовать любое другое средство, соответствующее вашим потребностям.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...