Директива и обработка DOM-события в AngularJS?

Question

[muzamy]

Есть директива, которая имеет событие mousedown

function evClick() {
    return {
        restrict: "AE",
        link: function (scope, element) {
            element.bind('mousedown', function (event) {
                console.log("mousedown");
            });
        }
    };
}

Добавимм часть html кода, в котором есть наша директива

angular.element(document.getElementById('foo')).append("<h2 ev-click>add element</h2>");

В добавленном коде директива не срабатывает

Как заставить работать директиву в добавленном элементе?

Пример
plnkr.co/edit/nUasLau3vv4WvMINMNT9?p=preview

Comments

[Виталий Бобров]

лучше использовать ангуляр как он задуман - а не бороться с ним - вы пытаетесь писать как на jQuery

Answer 1

[Alexey Bykov]

Angular не умеет парсить HTML при каждом изменении со стороны пользователя. Если нужно динамически генерировать шаблоны, то следует использовать $compile сервис:

angular.element(document.getElementById('foo')).append($compile("<h2 ev-click>add element</h2>")($scope));

Пример на plnkr

Answer 2

[lega]

Если Angular.js не критичен, вот пример на Angular Light.