I am currently working on integrating the jQuery multiselect plugin using a directive within my application. Here is the select element:
<select multiple
ng-model="data.partyIds"
ng-options="party.id as party.name for party in parties"
xs-multiselect="parties">
</select>
The parties model is fetched via $http. The multiselect plugin interprets the option elements within the select and creates the aesthetically pleasing multi-select feature.
Is it possible to determine when the select element has been populated with options so that I can prompt the multiselect plugin to update its data?
This is the directive I have created:
machineXs.directive("xsMultiselect", function() {
return {
restrict: "A",
require: '?ngModel',
link: function(scope, element, attrs, ngModel) {
element.multiselect().multiselectfilter();
scope.$watch(scope[attrs["xsMultiselect"]], function() {
// Although I attempted watching, it did not provide a solution
element.multiselect('refresh');
element.multiselectfilter("updateCache");
});
}
}
});