在angularJS中向表添加行的更好解决方案

debugcn 发表于 Dev

穆罕默德·蔡因（Mohamad Zein）

我正在编写一个angularJS Web应用程序。在我的主页上，我有一张桌子，上面有一排（药物，时期，剂量）标签。我想使用一个按钮（添加药物）将行动态添加到表中，该按钮的内容与第一个按钮完全相同

我成功地做到了。但是，我的解决方案看起来并不理想。

在下面显示的HTML页面中，我在每行中为行添加了ng-repeat。

 <table class="table">
    <tr ng-repeat="row in rows">
        <td>
            <label>{{row.drug}}
            </label>
        </td>
        <td>
            <label>{{row.dose}}
            </label>
        </td>
        <td>
            <label>{{row.period}}
            </label>
        </td>
    </tr>
</table>

在我的控制器中，我必须在addRow（）函数中指定所添加的每个作用域的名称，即使在$ scope.rows中定义时已经为其指定了字符串名称。所以我要重复相同的步骤。

 $scope.rows = [
                    {   'drug': "Drug",
                        'dose':'Dose',
                        'period': "Period",
                        }];

    $scope.addRow = function() {

        $scope.rows.push({'drug': "Drug", 'dose': "Dose", 'period': "Period});

    }

有什么更好的理想解决方案？

伊曼纽尔·罗萨尔（Immanuel Rosal）

您可以使用angular.copy（）;

$scope.rows = [
    {   
        'drug': "Drug",
        'dose':'Dose',
        'period': "Period",
    }
];

$scope.addRow = function() {

    $scope.rows.push(angular.copy($scope.rows[0]));

}

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。