AngularJS -ng- SelectBoxIt完成select填充后的jquery插件选项
AngularJS -ng- SelectBoxIt完成select填充后的jquery插件选项
提问于 2013-11-22 01:16:03
我使用下面的代码使用AngularJS填充一个选择框：
<select ng-model="department"
ng-options="dept as dept.name for dept in departmentList"
class="fancy">
<option value="">-- select an option --</option>
</select>但是我需要使用SelectBoxIt jquery插件来呈现这个选择框。
选择的硬编码版本工作得很好，因为我在处理页面这一部分的控制器底部有SelectBoxIt的初始化：
$targetSelects.selectBoxIt({
theme: "bootstrap"
, downArrowIcon: "arrow"
, showFirstOption: false
});
$targetSelects.on({
"open" : onOpen
, "close" : onClose
});我现在认为SelectBoxIt初始化是在角度填充的选择框完成填充之前发生的。
这看起来可能吗？如果是这样，我该如何解决这个问题呢？我认为这可能是使用延迟对象的情况，但不确定将其注入到何处。
任何帮助都将不胜感激。
更新
我将插件调用重新实现为指令。它确实有效。它将下拉框初始化为一个选项选择框，但在angular使用ng- SelectBoxIt填充下拉框之前仍在执行此操作。
.directive('fancySelect', function() {
return {
restrict: 'A',
link: function(scope, element, attrs) {
var $targetSelects = $(element),
selectConfig = {
theme: "bootstrap",
downArrowIcon: "arrow",
showFirstOption: false
};
function onOpen(event){
$(this).data("selectBox-selectBoxIt").downArrow.addClass("drop-up");
log('onOpen');
}
function onClose(event){
$(this).data("selectBox-selectBoxIt").downArrow.removeClass("drop-up");
log('onClose');
}
$targetSelects.selectBoxIt(selectConfig);
$targetSelects.on({
"open" : onOpen,
"close" : onClose
});
$targetSelects.selectBoxIt('refresh');
}
};
});Stack Overflow用户
发布于 2013-12-10 20:54:34
一种方法是观察模型，然后在下一个摘要周期中触发一个事件。
scope.$watch(model, function() {
scope.$evalAsync(function() {
// event
});
});我已经在这里正确地写下了：Detect when ng-options has finished rendering。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/20127635
复制相关文章
相似问题
腾讯云开发者
