使用 AngularJS 自定义指令启动 jQuery 函数

【问题标题】：Initiate jQuery function by using AngularJS custom directive使用 AngularJS 自定义指令启动 jQuery 函数
【发布时间】：2019-09-17 22:37:55
【问题描述】：

这是我想调用$('.ams-items').slimScroll()函数的代码

angular.element(document).ready(function () {
  $('.ams-items').slimScroll({
    alwaysVisible: true
  });
});

请帮帮我！

【问题讨论】：

请阅读How to create a Minimal, Complete, and Verifiable example 和How do I ask a good question?。您的问题不符合社区的准则，很快就会被版主关闭。如果您希望得到任何答案，您应该适当地编辑它。好的问题通常包括：期望的结果或结果、到目前为止您为解决问题所做的尝试等等。

标签： jquery angularjs angularjs-directive

【解决方案1】：

如何在自定义指令中封装 jQuery 代码¹

任何操作 DOM 的 jQuery 代码都应该封装在 custom directive 中，以便在 AngularJS 框架实例化元素时执行。

app.directive("mySlimScroll", function()
     return {
         link: postLink,
     };
     function postLink(scope,elem,attrs) {
         elem.slimScroll({
             alwaysVisible: true
         });
     }
});

用法：

<div class="ams-items" my-slim-scroll>
</div>

要使用 jQuery，只需确保它在 angular.js 文件之前加载。

有关详细信息，请参阅

【讨论】：

如何在自定义指令中封装 jQuery 代码1

用法：

如何在自定义指令中封装 jQuery 代码¹