Question

我想创建一个用作角度数据表包装器的指令，因为我需要在数据表之上实现更多功能，并且还希望在不更改应用程序代码的情况下替换数据表。

第一步，我想用DIV元素包围table元素，但是我所有的尝试都失败了。

这是输入html：

<table my-directive></table>

输出应如下所示：

<div><table my-directive></table></div>

我尝试过的内容（ES6代码）：

class Controller {
    constructor($element) {
      $element; // this should be the DIV element but is the original TABLE element
    }
}


class DirectiveImpl {
    constructor($compile, $window) {
        this.$compile = $compile;
        this.$window = $window;
    }

    link(scope, element) {
        // I want turn the TABLE element into a angular datatable
        element.attr("datatable", "ng");
        element.attr("dt-instance", "dtInstance");
        scope.dtInstance = (instance) => {
            console.log("datatable instance set to", instance);
        };
        let widget = this.$compile(element)(scope);
        
        // create a DIV and put the TABLE into it
        let container = element[0].ownerDocument.createElement("div");
        element.replaceWith(container);
        angular.element(container).append(widget);
    }
}

首先，这是正确的方法吗？我还担心内存泄漏，因为我基本上是用新编译的元素替换原始元素。

在控制器中，$ element引用原始表元素，而不是DIV。在我看来，这不是很直观。

最后，将数据表实例对象转移到控制器中的最佳方法是什么？我将需要知道何时创建它才能执行进一步的操作。

我很高兴有人可以将我推向正确的方向。

Angularjs指令：环绕声宿主元素

0 个答案: