Javascript Angular js与jquery multiselect不兼容吗

我有这个jQuery选择器。一切正常，但只要添加并初始化angular，multiselect就停止工作。您可以尝试删除所有不必要的内容，您将看到以下情况：

（我不知道为什么github的URL在这里不起作用，但如果需要，您可以下载该文件，因为这不是我试图描述的问题）

SPIROOX-活动
竞选管理
活跃的
暂停的
关闭
$（文档）.ready（函数（）{
$（“#multiselect_状态”）。multiselect({
includeAlloption:true，
启用筛选：正确，
非选定文本：“状态”
});
});
var my_app=angular.module（“活动列表”[]）；
变量控制器={}；
controllers.campaign\u list\u controller=函数（$http）{
这是一个过滤器={
状态：“活动”，
客户端：空
};
var={}；
this.update_fields=函数（）{
log（“更新！”）；
log（this.filters）；
}
}
我的应用程序控制器（控制器）；

如注释中所述，在指令中添加jQuery插件代码，并删除

文档。ready

内容，因为指令中不需要它。 当您在指令的link方法中添加插件代码时，DOM就准备好了

我没有测试angular代码的其余部分，因为它看起来太复杂了，我已经对它进行了重新编码以提高可读性。（也许你的代码正在工作，但我不会这样编码。）

请看一下下面的演示或本演示

2015年9月29日更新

为了更好地理解指令，请阅读有关获取自定义指令基础知识的文档

无论如何，以下是对该指令的解释：

multiselect

指令作为属性指令（

restrict:'A'

）添加到select标记中，因此link函数中的元素是要应用jQuery插件的select标记。（在链接内部，使用jQuery函数是安全的，但我建议将使用量降至最低。）

在google或此处搜索

链接、编译、控制器

，了解更多指令信息。这里有一个关于他们之间区别的问题

您还可以使用模板创建一个元素指令，然后可以将select标记添加到指令中，并通过双向绑定传递您的选择。这里可能更好，因为它更易于重用

angular.module（'活动列表'，[]））
.controller（“活动列表控制器”，活动列表控制器）
.指令（“多选”，多选指令）；
函数活动列表控制器（$http）{
这是一个过滤器={
状态：“活动”，
客户端：空
};
var={}；
this.update_fields=函数（）{
log（“更新！”）；
log（this.filters）；
}
}
函数MultiSelectDirective（）{
返回{
限制：“A”，
链接：功能（范围、元素）{
$（元素）。多选({
includeAlloption:true，
启用筛选：正确，
非选定文本：“状态”
});
}
}
}

竞选管理
活跃的
暂停的
关闭

如果您在使用此multiselect插件时仍然遇到问题，我建议您使用指令创建自己的multiselect插件，这非常简单。看看这个multiselect插件，我想你的标题应该提到的不仅仅是“jquerymultiselect”，而是引导multiselect。不确定这是否有帮助，但请尝试以下内容：

document.ready

在angular中毫无价值。jQuery插件应该在指令中初始化，以确保代码运行时元素存在。也就是说，您可能应该考虑摆脱bootsrap.js，使用角度模块和指令，这些模块和指令也很容易获得。您在这里没有遇到错误：“my_app.controller（controllers）”？“controller”方法需要两个参数：“controller（name，constructor）；”无错误。顺便说一句，jquery的复选框没有被选中，我不知道为什么在FF 41中它会起作用（请参阅）。您在控制台中收到任何错误消息吗？您能解释一下您添加的指令方法是如何工作的吗？