0

我有一个 Angular 1.4.9 应用程序。我正在使用第三方 JS 插件（Jasny Bootstrap）。它有一些 JS 组件，这些组件似乎使用简单的 JQuery。

他们的文档说该插件会在关键点发出事件，例如“itemShown”。我想知道我是否可以在我的页面控制器中检测到这一点并对其采取行动，例如：

“关于 itemShown 函数 () {...”

4

2 回答 2

0

在 AngularJS 中处理自定义 jQuery 事件

以下示例显示了一个自定义指令，该指令检测自定义 jQuery 事件并调用由属性定义的函数。

app.directive("onBsShowOffcanvas", function($parse) {
    return function linkFn(scope, elem, attrs) {
        var fn = $parse(attrs.onBsShowOffCanvas);
        elem.on("show.bs.offcanvas", function(e) {
            fn.assign(scope, {$event: e});
            scope.$apply();
        });
    }
});

要在 HTML 中使用该指令：

<div on-bs-show-offcanvas="offcanvasHandler($event)">

我建议暴露事件对象，$event因为这是 AngularJS 事件指令的惯例。

$事件

指令喜欢ngClick并ngFocus公开$event该表达式范围内的对象。当 jQuery 存在时，该对象是jQuery 事件对象的实例或类似的 jqLit​​e 对象。

-- AngularJS 开发者指南 -- $event

于 2016-02-18T00:08:53.567 回答
0

如果您在应用程序中嵌入 jQuery（因为 Angular 默认嵌入 jQlite，但不嵌入 jQuery），这是一种解决方案。

元素准备好后，您可以从控制器执行此操作：

$element.ready(function () {
    $('#offcanvasId').on('hide.bs.offcanvas', function(){
        //...
    })
});

尽管如此，必须有一些没有 jQuery 的解决方法。

您可以在文档https://docs.angularjs.org/api/ng/function/angular.element上查看更多信息

于 2016-02-18T10:44:06.350 回答