AngularJS ng-click不会被JQuery代码中的动态按钮触发

时间:2014-06-26 15:05:52

标签: javascript jquery angularjs angularjs-ng-click

在jquery代码中我试图在范围中添加一个函数,然后从dyncamically创建的按钮调用该函数但是没有调用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));
}

});

对angularjs使用chrome的扩展我已检查附带按钮的localscope是否具有这两个功能。

我在这里缺少什么?

感谢您的期待!

1 个答案:

答案 0 :(得分:3)

而不是从此行的编译输出中获取HTML,

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

按原样追加编译后的输出......

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

之后您可能需要致电localScope.$apply()