Question

我有一个表指令，基本上循环遍历数组并插入html，如下所示：

<tr ng-if="isComplete()" ng-repeat="row in paged.page()" ng-click="rowClick(row, $event)">
    <td ng-repeat="header in headers" ng-bind-html="trustAsHtml(header.formatter(row[header.property]))"></td>
</tr>

该指令配置如下：

  $scope.headers = [
    comsTable.header('id', 'ID', function(id, obj) {
      return '<a href="#" ng-click="doSomething(obj)">' + id + '</a>';
    }),
    comsTable.header('name', 'Name'),
    comsTable.header('age', 'Age')
  ];

第一个参数是数组中每个元素的对象属性。

使用了ng-bind-html，我可以传入html，并使用trustAsHtml服务中的$ce。

我可以在配置表时插入这样的基本html：

  $scope.headers = [
    comsTable.header('id', 'ID', function(id, obj) {
      return '<a href="#" ng-click="doSomething(obj)">' + id + '</a>';
    }),

如果我想插入动态创建的指令。我可以在不重新构建整个表的情况下实现这一目标。我相信我必须使用$compile并将节点/元素附加到DOM，但是我可以等到表格被渲染到调用$compile之后，或者最好的方法是什么？

我是棱角分明的，所以我不确定实现这一目标的最佳方法是什么。

这是一个plunker，显示我到目前为止的指令

将指令/组件动态插入角表单元格

0 个答案: