AngularJS ng-щелчок не запускается из динамических кнопок в коде jQuery

#javascript #jquery #angularjs #angularjs-ng-click

#javascript #jquery #angularjs #angularjs-ng-click

Вопрос:

в коде jquery я пытаюсь добавить функцию в область видимости, а затем вызвать эту функцию из динамически созданной кнопки, но ng-click не вызывается:

 $(document).on("click", ".inlinelbl", function () {
    var $this = $(this);
    var self = this;
    var localScope = angular.element(self).scope();

        if (localScope.InlineSave_Click == undefined) {
            localScope.InlineSave_Click = function (elem, event) {
               //function body
            }
        }

        if (localScope.InlineCancel_Click == undefined) {
            localScope.InlineCancel_Click = function (elem, event) {
                //function body
        }


    var html = "<span class='d'><button class='btn btn-default' ng-click='InlineSave_Click(this, event)' style='display:inline-block;'></button>";
    html  = "<button class='btn btn-default' ng-click='InlineCancel_Click()'  style='display:inline-block;'></button></span>";

    var injector = angular.element(document.getElementById('app')).injector();
    var $compile = injector.get('$compile');
    var compiledHtml = $compile(html)(localScope);

    $this.closest("span.s-element").removeClass("hide");
    $this.closest("span.s-element").append($(compiledHtml[0].outerHTML));
}
 

});

Используя расширение Chrome для angularjs, я проверил, что localscope, прикрепленный к кнопкам, имеет обе функции.

Чего мне здесь не хватает?

Спасибо в ожидании!

Комментарии:

1. Попробуйте изменить последнюю строку на $this.closest("span.s-element").append(compiledHtml); . Возврат HTML-кода из результата компиляции сводит на нет цель его компиляции. Вам также может потребоваться вызвать localScope.$apply() после этого.

2. это сделало свое дело. пожалуйста, добавьте его в качестве ответа.

Ответ №1:

Вместо того, чтобы брать HTML из скомпилированного вывода в этой строке,

 $this.closest("span.s-element").append($(compiledHtml[0].outerHTML));
 

Добавьте скомпилированный вывод как есть…

 $this.closest("span.s-element").append(compiledHtml);
 

Возможно, вам потребуется позвонить localScope.$apply() позже.