AngularJS UniformJS Select Control not updating
angularjs, angularjs-directive, jquery-uniform
Solution
Found it. For the sake of completeness, I'm copying my comment here:
It looks like Uniform is really hacky. It covers up the actual select element, and displays span instead. Angular is working. The actual select element's value is changing, but the span that Uniform displays is not changing.
So you need to tell Uniform that your values have changed with `jQuery.uniform.update`. Uniform reads the value from the actual element to place in the span, and angular doesn't update the actual element until after the digest loop, so you need to wait a little bit before calling update:
app.controller('MainCtrl', function($scope, $timeout) {
$scope.reset = function() {
$scope.test = "";
$timeout(jQuery.uniform.update, 0);
};
});
Alternatively, you can put this in your directive:
app.directive('applyUniform',function($timeout){
return {
restrict:'A',
require: 'ngModel',
link: function(scope, element, attr, ngModel) {
element.uniform({useID: false});
scope.$watch(function() {return ngModel.$modelValue}, function() {
$timeout(jQuery.uniform.update, 0);
} );
}
};
});
Problem
I'm building an application using AngularJS and UniformJS. I'd like to have a reset button on the view that would reset my select's to their default value. If I use uniform.js, it isn't working. You can examine it here: http://plnkr.co/edit/QYZRzlRf1qqAYgi8VbO6?p=preview If you click the reset button continuously, nothing happens. If you remove the attribute, therefore no longer using uniform.js, everything behaves correctly. Thanks UPDATE: Required the use of timeout. ``` app.controller('MainCtrl', function($scope, $timeout) { $scope.reset = function() { $scope.test = ""; $timeout(jQuery.uniform.update, 0); }; }); ```