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

Question

В основном, у меня есть структура, как этот пример

Каждая ячейка последнего столбца должна иметь следующую формулу:

value[i][2] = value[i-1][2] + value[i][0] - value[i][1]

У меня на самом деле 2 проблемы. Первый приходит, когда я просто пытаюсь запрограммировать первый ряд таблицы. Что не так с этой чрезвычайно простой вещью?

angular.module('calc', [])
    .controller('cont', function($scope) {
        $scope.addNumbers = function() {
            var c = aCom[30][5];
            var a = parseFloat($scope.entrata1);
            var b = parseFloat($scope.uscita1);
            return  c+a-b;
        }
});

принимая во внимание entrata1 а также uscita1 как они есть value[0][0] а также value[0][1],

Но самое главное, как я могу распространить формулу на все остальные строки? Учтите, что каждая строка, кроме первой, создается динамически с appendChild()функция к body, я должен использовать в каждом добавленном элементе функцию setAttribute("ng-model","entrata")? Спасибо

Answer 1

Я бы посоветовал забыть об этом. Используйте ng-repeat и добавьте строки, добавляя к области видимости, как это

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>

Вы можете проверить в Plunker