Директива Angularjs: Элемент окружающего хоста - PullRequest
Новая
       11

Директива Angularjs: Элемент окружающего хоста

0 голосов
/ 09 апреля 2019

Я хочу создать директиву, которая будет работать в качестве оболочки для angular-datatables, потому что мне нужно реализовать некоторые дополнительные функции поверх datatables, а также чтобы их можно было заменять без изменения кода приложения.

Asпервый шаг, я хочу окружить элемент таблицы элементом DIV, но все мои попытки не удаются.

Это входной 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);
    }
}

Прежде всего, это будет правильный подход?Я также боюсь утечек памяти, потому что я в основном заменяю оригинальный элемент на недавно скомпилированный.

В контроллере элемент $ ссылается на оригинальный элемент таблицы, а не на DIV.Мне кажется, это не очень интуитивно понятно.

И, наконец, как лучше всего передать объект экземпляра с данными в контроллер?Мне нужно знать, когда он создан, чтобы иметь возможность выполнять дальнейшие действия.

Я ценю, если кто-то может подтолкнуть меня в правильном направлении.

...