Question

我正在尝试将新行追加到表中，其中现有行由ng-repeat创建。但是，当我点击添加新按钮rater而不是追加新行时，它会删除现有行并添加新行。请问有谁可以在这方面帮助我？

这是代码和fiddle link。

var app = angular.module("app", []);
app.controller("simpleController", function($scope)
 {
    var descriptions = ['item1','item2','tem3'];
     $scope.items = descriptions;

 });

app.directive("addRow",function($compile)
{
    var newRow;
    newRow = '<tr><td>New Description</td><td><a href="javascript:void(0)" add-row>+</a></td><td><a href="javascript:void(0)" delete-row>-</a></td></tr>';
    return{
        restrict: 'A',
        link: function(scope, element,attrs,controller){
            element.on("click", function() {
                console.log("clicked on activity add row");
                $compile(element.parent().parent().parent().append(newRow))(scope);
            });
        }
    }

Answer 1

每当我们想在角元素中插入新元素时，它就不会直接理解为角度。首先，我们需要使用$compile API通过编译运行该元素，然后将其附加到元素。

您需要像下面这样编码。你需要首先$编译你的元素然后将它追加到元素。

element.on("click", function() {
    console.log("clicked on activity add row");
    element.parent().parent().parent().append($compile(newRow)(scope));
});

Working Fiddle

根据@huanfeng观察，<tr>无法正常工作，它会转换为span。在我找到的护目镜之后，AngularJS有issue。要解决此问题，您可以使用问题链接中的任何工作解决方案。

更新1

您可以通过更多Simpler way

执行此操作，而不是追加元素

仅推送ng-repeat数组中的变量，即$scope.items.push('New Description')。 ng-repeat将使用您指定的描述再为您呈现一个。

感谢。

为什么在angularjs .append中充当.html？

1 个答案: