ng-click无法处理动态超链接

时间:2017-03-07 07:39:40

标签: javascript jquery html angularjs

我有一个空表开始,带有添加按钮的表单用于逐个填充表中的行。 表格中的最后一列是删除,我填充了一个带有ng-click属性的超链接,但它没有被解雇...我尝试了onclick功能。

HTML:

<tr ng-repeat="entity in entities">
    <td>{{ $index + 1 }}</td>
    <td>{{ entity.entityType }}</td>
    <td>{{ entity.orgType }}</td>
    <td>{{ entity.entityId }}</td>
    <td>{{ entity.name }}</td>
    <td>{{ entity.addressLine1 }}</td>
    <td>{{ entity.city }}</td>
    <td>{{ entity.state }}</td>
    <td>{{ entity.zip }}</td>
    <td ng-bind-html="entity.edit"></td>
    <td ng-bind-html="entity.remove"></td>
</tr> 

Javascript这是在表中添加行的调用的click事件:

 $scope.entities = [];

 $scope.addEntity = function() {
     console.log($scope.entity);
     $scope.entity.$index = $scope.entities.length;
     var $el = "<a ng-click='deleteEntity(" + $scope.entity.$index + ")'>Delete</a>";
     $scope.entity.edit = $sce.trustAsHtml("<a ng-click='editEntity(" + $scope.entity.$index + ")'>Edit</a>");
     $scope.entity.remove = $sce.trustAsHtml($el);
     $scope.entities.push($scope.entity);
     $scope.reset();
     $compile($el)($scope);
 }

HTML已正确创建,deleteEntity函数具有索引值。

1 个答案:

答案 0 :(得分:1)

您可以直接使用它:

<tr ng-repeat="entity in entities track by $index">
    <td>{{ $index + 1 }}</td>
    <td>{{ entity.entityType }}</td>
    <td>{{ entity.orgType }}</td>
    <td>{{ entity.entityId }}</td>
    <td>{{ entity.name }}</td>
    <td>{{ entity.addressLine1 }}</td>
    <td>{{ entity.city }}</td>
    <td>{{ entity.state }}</td>
    <td>{{ entity.zip }}</td>
    <td><a ng-click='editEntity($index)'>Edit</a></td>
    <td><a ng-click='deleteEntity($index)'>Delete</a></td>
</tr>

我认为这可以解决您的问题。