Получение пар ключ-значение из ответа json в угловое js

Question

Получение пар ключ-значение из ответа json в угловое js

0

Как сопоставить json-ответ с таблицей на странице html.

Контроллер Angularjs:

app.controller('tableController', function ($scope,$http)
            {
                $scope.customerTable = [];
                $scope.getTable = function ()
                {
                    $http.get('<%=request.getContextPath()%>/GetTable.do').success(function (data)
                    {
                        $scope.customerTable = data;
//                        console.log($scope.customerTable);
                    });
                };
            });

html-код:

 <div ng-controller="tableController">
                <!--<p>Click <a ng-click="getTable()">here</a> to load data.</p>-->
                <table>
                    <tr>
                        <th>Card Number</th>
                        <th>First Name</th>
                        <th>Opening Balance</th>
                        <th>Withdrawal</th>
                        <th>Deposit</th>
                        <th>Closing Balance</th>
                        <th>Tx Date</th>
                        <th>Usage_Type</th>
                    </tr>
                    <tr ng-repeat="data in customerTable ">
                        <td>{{data[0]}}</td>
                    </tr>
                </table>
                <br>
                <button class="form-control btn btn-success" type="submit" ng-click="getTable()">Load Table Data</button>
            </div>

Ответ находится в одном массиве с ключами, парами значений. Нужно ли мне модифицировать ng-repeat?

Вот ответ json:

[{"TXDATE":"1-Aug-14","FIRST_NAME":"MOSES","USAGE_TYPE":"HOTELS/MOTELS/RESORTS","WITHDRAWAL":"15200","DEPOSIT":"0","CARD_NUMBER":"AL98****66325","CLOSING_BAL":"-362764.96","OPENING_BALANCE":"0"}]

skubski 29 июнь 2015, в 12:34

Источник

Теги:

angularjs

3 ответа

0

Да, вы должны изменить его.

<tr ng-repeat="data in customerTable ">
    <td>{{data['CARD_NUMBER']}}</td>
    <td>{{data['TXDATE']}}</td>
    <td>{{data['OPENING_BALANCE']}}</td>
    ...
</tr>

Davide Fiorello 29 июнь 2015, в 08:04

0

Используйте атрибуты. должен быть:

<tr ng-repeat="data in customerTable ">
   <td>{{data.TXDATE}}</td> <!-- result: 1-Aug-14 -->
</tr>

и так далее.

Jax 29 июнь 2015, в 07:20

Ещё вопросы

skubski · Accepted Answer · 2015-06-29T07-54-00.000Z

Вы можете использовать поля в каждом объекте:

<tr ng-repeat="data in customerTable ">
     <th>{{data.FIRST_NAME}}</th>
     <th>{{data.CARD_NUMBER}}</th>
     ...
</tr>

Возможно, вы могли бы использовать директиву для подобных итераций, связанных с таблицей.