如何使用带有附加元素的angularJS答案

【问题标题】：how to use angularJS with appended elements如何使用带有附加元素的angularJS
【发布时间】：2019-01-30 05:46:38
【问题描述】：

基本上，我有这样的结构example

最后一列的每个单元格都需要有这个公式：

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

我实际上有两个问题。当我只是尝试对表格的第一行进行编程时，第一个出现了。这个极其简单的事情有什么问题？

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]。

但最重要的是，如何将公式扩展到所有其他行？考虑到除了第一行之外的每一行都是使用body 的appendChild()函数动态创建的，我是否必须在每个附加项上使用函数setAttribute("ng-model","entrata")？谢谢

【问题讨论】：

标签： javascript html angularjs angularjs-scope appendchild

【解决方案1】：

我建议忘记 appendchild。使用 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

【讨论】：