javascript - AngularJs中如何将数据存储到对象中

Question

我想将表单数据存储到 Controller 中声明的数组(它是一个对象数组)中。每次提交表单时，对象格式的表单数据都应附加到名为 expenses 的数组中。代码是——

controller.js

angular.module('myApp.controllers', [])
 .controller('expenseForm', function($scope, $location) {
  $scope.expenses = [{
  exTitle: "",
  amount: "",
  typeOfShare: "",
  date: ""
 }];
 $scope.**submitExpense** = function (expenseInfo) {

 }
});

---

expense.html

<form class="clearBoth" ng-controller="expenseForm" ng-submit="submitExpense(expenseInfo)">
    <div class="expenseDesc" ng-model="expenseInfo">
        <div class="leftDesc">
            <div class="item">
                <label for="title">Expense Title</label>
                <input type="text" id="exTitle" name="title" ng-model="expenseInfo.exTitle"/>
            </div>
            <div class="item">
                <label for="amount">Total Amount Spend</label>
                <input type="text" id="totAmt" name="amount" ng-model="expenseInfo.amount"/>
            </div>
            <div class="item">
                <label for="shareType">Type of Share</label>
                <select name="shareType" ng-model="expenseInfo.typeOfShare">
                    <option value="equal">Equal</option>
                    <option value="unequal">Unequal</option>
                </select>
            </div>
        </div>
        <div class="rightDesc">
            <div class="item">
                <label for="date">Date</label>
                <input type="text" id="date" name="date" ng-model="expenseInfo.date"/>
            </div>
        </div>
        <!-- <div class="lowerSection">
            <div class="expenseTable clearBoth">
                <div class="tblHeader row">
                    <div class="sNo">SNo.</div>
                    <div class="email">Email</div>
                    <div class="name">Name</div>
                    <div class="share">Share</div>
                    <div class="paid">Paid</div>
                    <div class="owesTo">Owes To</div>
                    <div class="getsFrom">Gets From</div>
                    <div></div>
                </div>
                <div class="tblBody">
                    <div class="row">
                        <div class="sNo">1</div>
                        <div class="email">gnehapk@gmail.com</div>
                        <div class="name">Neha</div>
                        <div class="share">700</div>
                        <div class="paid">500</div>
                        <div class="owesTo">200 to Sneha</div>
                        <div class="getsFrom"></div>
                        <div></div>
                    </div>
                </div>
                <div class="tblFooter clearBoth">
                    <button id="addMember">Add Member</button>
                </div>
            </div>
        </div> -->

    </div> <!--end of expenseDesc-->
    <input type="submit" value="AddExpense" class="clearBoth" />
</form>

我在 html 页面中声明了一个 expenseInfo 变量，它将包含所有详细信息，例如标题、日期等。我应该在 submitExpense 函数中写些什么，这样该对象附加到 expenses 数组中？

Answer 1

只需使用push 命令:

 $scope.submitExpense = function (expenseInfo) {
    $scope.expenses.push(expenseInfo);
 }

请参阅 中的演示 Fiddle