0

我有一个 AngularJS 指令，它将jQuery Tooltipster附加到元素上，ng-repeat如下所示：

看法：

div.chat-wrapper
    ul.chat-messages
        li(ng-repeat='chat in chatmessages' chat-tooltip)

指示：

angular.module('app')
    .directive('chatTooltip',
        function() {
            return {
                restrict: 'A',
                link: function(scope, el, attrs) {
                    scope.mute = function() {
                        console.log('hello world');
                    };

                    $(el).tooltipster({
                        content: $('<button ng-click="mute()" class="btn">Mute</button>'),
                        position: 'left',
                        positionTracker: true,
                        trigger: 'hover',
                        interactive: true,
                        autoClose: false
                    });
                }
            };
        }
);

我想调用or -mute()中定义的函数？由于插件在指令中添加了 HTML 内容 - 我不确定我需要做什么？scope$scope

4

2 回答 2

1

我可以尝试猜测。

这里的问题是您的 html 是由 jQuery 解析的。而不是 Angular 的解析器。

因此，在您提供任何自定义并调用预定义方法之前，我建议您为内容创建一个元素：

var button $(....);

然后将此值传递给content选项并使用方法强制订阅按钮的单击事件button.on('click')。

于 2014-12-21T16:54:53.003 回答
1

请看一下这个问题/答案：

如何用 jsf reRender 或 ajax 加载替换 html 内容，并用 AngularJS 重新绑定新的 DOM？

它展示了如何在 jquery 更改后“重新绑定”angularjs，以及如何从 jQuery 调用 angularjs 函数。

但是，简而言之，您可以使用如下代码从范围调用 angularjs 函数（通过 id 标识您的控制器）：

$('#idFromMyController').scope().myFunction();
于 2014-12-22T13:22:01.213 回答