2014-05-25 38 views
3

我想將表單數據存儲到在控制器中聲明的數組(它是一個對象數組)。每次提交表單時,對象格式的表單數據都應附加到名爲expenses的數組中。該代碼是 -如何將數據存儲到AngularJs中的對象

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">[email protected]</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變量,其中將包含所有的細節,如標題,日期等。我應該寫什麼submi T費用函數讓這個對象得到附加在費用數組?

+1

'expenses.push(JSON.parse(JSON.stringify(expenseInfo))'(解析和字符串化是使副本) –

+0

@BenjaminGruenbaum你救了我的小時:-)謝謝 –

回答

3

只需使用push命令:

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

看到演示中Fiddle

相關問題