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

Question

我想在 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 控件，我想了解处理它们的最佳方法。谢谢！

Answer 1

假设您在引用 Angular之前在脚本标记中引用 JQuery ，它应该很简单：

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

然后：

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