Bank of Xactware

by tadchristiansen

HTML

<div ng-app>
<div ng-controller="BankCtrl">
    <h2>Bank of Xactware</h2>
    <div>Balance: {{balance | currency: "$"}}</div>
    <div>Amount: <input ng-model="amount" type="text" /></div>
    <div>
        <button ng-click="deposit(amount)">Deposit</button> 
        <button ng-click="withdraw(amount)">Withdraw</button>
    <div>
        <h3>Transaction History</h3>
        <table border="1">
            <tr>
                <th>Date</th>
                <th>Type</th>
                <th>Amount</th>
                <th>Balance</th>
            </tr>
            <tr ng-repeat="transaction in transactions">
                <td>
                    {{transaction.date | date: "dd/MM/yyyy hh:mm:ss a"}}
                </td>
                <td>
                    {{transaction.type}}
                </td>
                <td>
                    {{transaction.amount | currency: "$"}}
                </td>
                <td>
                    {{transaction.balance | currency: "$"}}
                </td>
            </tr>
        </table>
    </div>
</div>
</div>

JavaScript

function BankCtrl($scope)
{
    function addTransaction(date, type, amount, endingBalance)
    {
        $scope.transactions.push({
            date: date, 
            type: type, 
            amount: amount, 
            balance: endingBalance
        });
    }
                                  
    $scope.balance = 1000;
    $scope.transactions = [];
    $scope.deposit = function (amount) {
        if (!isNaN(parseInt(amount)))
        {
            $scope.balance += parseInt(amount);
            addTransaction(new Date(), "Deposit", amount, $scope.balance);
        }
    }
    $scope.withdraw = function (amount) {
        if (!isNaN(parseInt(amount)))
        {
            $scope.balance -= parseInt(amount);
            addTransaction(new Date(), "Withdraw", amount, $scope.balance);
        }
    }
    
    
}