Использование AngularJS для хранения пользовательского ввода в массиве при увеличении указанного массива - PullRequest
0 голосов
/ 29 января 2019

Я создаю калькулятор дебетов / кредитов с помощью AngularJS, чтобы ознакомиться с AngularJS.Я пытаюсь сохранить пользовательский ввод в массиве, который затем можно отобразить в таблице под вводом.

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

debit[0];
credit[0];
date[0];
purpose[0]; 

Затем пользователь сохранит данные за этот день и сможет вводить все новые данные, сохраняя предыдущие данные в таблице ниже.

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

    <div ng-app="">

    <table>

        <tr>
            <th>
                <p>Input a debit:</p>
                <input type="number" ng-model="debit">
            </th>
            <th>
                <p>Input a credit:</p>
                <input type="number" ng-model="credit">
            </th>

            <th>
                <p>Date:</p>
                <input type="text" ng-model="date">
            </th>

            <th>
                <p>Purpose:</p>
                <input type="text" ng-model="purpose">
            </th>
        </tr>

    </table>

    <table>

        <tr>
            <th>
                <p>Debit</p>
                <p></p>
                <p id="debit"></p>
            </th>
            <th>
                <p>Credit</p>
                <p>{{ credit }}</p>
            </th>
            <th>
                <p>Date</p>
                <p>{{ date }}</p>
            </th>
            <th>
                <p>Purpose</p>
                <p>{{ purpose }}</p>
            </th>
            <th>
                <p>Balance</p>
                    <div ng-app="">
                        <p>{{ debit - credit }}</p>
                    </div>
            </th>
        </tr>

    </table>

</div>

    <script>
        var debitArray = [];
        document.getElementById("debit").innerHTML = debitArray;
    </script>

1 Ответ

0 голосов
/ 29 января 2019

Как насчет использования объекта для хранения всей информации определенного пользователя со свойством day в виде массива объектов, в котором будет храниться вся информация:

let obj = {
    userId: 1,
    userName: "John",
    userEmail: "john@john.com",
    day: [
            {
            debit: [
                [valueForArrayOfDay0],
                [valueForArrayOfDay0]
            ],
            credit: [],
            date: [],
            purpose: []
            },
            {
            debit: [
                [valueForArrayOfDay1],
                [valueForArrayOfDay1]
            ],
            credit: [],
            date: [],
            purpose: []
            }
        ]
};

Если вы console.log (obj.day [0]) в результате вы получите этот объект:

{ 
    debit: [ [ 'valueForArrayOfDay0' ], [ 'valueForArrayOfDay0' ] ],
    credit: [],
    date: [],
    purpose: [] 
}
...