如何将 jQuery 控件包装为角度指令

How to wrap a jQuery control as an angular directive?

本文关键字:指令 包装 控件 jQuery      更新时间:2023-09-26

我想在 Angular 应用程序中使用此标记 UI 控件

https://github.com/aehlke/tag-it

如果没有 Angular,您只需初始化

<script type="text/javascript">
    $(document).ready(function () {
        $("#myTags").tagit();
    });
</script>

这会将任何名为 myTags 的有序列表转换为交互式标签

<ul id="myTags">
    <li>Tag1</li>
    <li>Tag2</li>
</ul>

这是一个小尖叫声http://screencast.com/t/vWng1BgUc1M7

问题是 - 我如何包装它以使用角度?我需要块在部分视图中。这意味着它对 jQuery 初始化例程不可用,因此不起作用。

我有许多jQuery控件需要包装,我想了解处理它们的最佳方法。谢谢!

假设

你在引用 Angular 之前在脚本标签中引用了 JQuery,它应该像这样简单:

app.directive('tagIt', function (){
   return function(scope, elem) {
      elem.tagit();
   }
});

然后:

<ul id="myTags" tag-it> ... </ul>