Как использовать angularJS с добавленными элементами

angular.module('plunker', []).controller('tableCtrl', function($scope,$filter) {
    $scope.rows = [{'a': 0,'u': 300},{'a': 0,'u': 150},{'a': 200,'u': 0},{'a': 0,'u': 300}];
    $scope.rowscalc = function(val){
    	var total=0;
    	angular.forEach($scope.rows, function(values, key){
    		if (key<=val) total += values.u-values.a;});
    	return total;
    };
    $scope.addRowM = function(){
    	$scope.rows.push({'a': 0, 'u': 0});
    };
});

<script src = "//unpkg.com/angular/angular.js"></script>
<div ng-app = "plunker" ng-controller = "tableCtrl">
    <table class = "table">
        <thead>
            <tr>
                <td class = "dthead">A</td>
                <td class = "dthead">U</td>
                <td class = "dthead">Total</td>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat = "row in rows">
                <td><input type = "number" ng-model = "row.a"/></td>
                <td><input type = "number" ng-model = "row.u"/></td>
                <td>{{rowscalc($index)}}</td>
            </tr>
            <tr>
                <td colspan = "3">
                    <button ng-click = "addRowM()">Add Row</button>
                </td>
            </tr>

        </tbody>
    </table>
</div>