ruhley / angular-color-picker

Vanilla AngularJS Color Picker Directive with no requirement on jQuery
http://ruhley.github.io/angular-color-picker/
MIT License
166 stars 79 forks source link

Support for getterSetter function #160

Closed ptodorov closed 7 years ago

ptodorov commented 7 years ago

Is there any way to either bind the color picker value to a getterSetter function or at least attach to a color change event without changing the ngModel value?

ruhley commented 7 years ago

Hi @ptodorov

There is an eventApi which has triggers for lots of events. Look in the Options section of the readme to find out more - https://github.com/ruhley/angular-color-picker#options. There is an onChange event.

Is that what you are after?

ptodorov commented 7 years ago

Hi @ruhley

I tried the onChange event already, but it triggers after the ngModel value is already changed. I need something similar to ng-model-options="{ getterSetter: true }", so I can invoke a function to change my encapsulated value.

ruhley commented 7 years ago

@ptodorov Sorry I didn't understand at first, I have never seen ng-model-options="{ getterSetter: true }" before (and I have been doing angular development for years). I did a quick example without changing this code base and it worked for me. See the code in this commit 08535af2fcdf58e7b48bdccdb23fcb1372bd5a92.

ptodorov commented 7 years ago

Hello again, sorry for the delay but I didn't have time to check that commit. Thanks for helping with that, at the end I found a way around using the event api.

As for the example, it's not actually using the getterSetter function. If you look at the console, the value of $scope.color is a function at first. But after you change the color from the picker, it becomes a value. So it breaks where it's expected to be a function.

I think this could be fixed by checking for ng-model-options and if getterSetter is true, updating the model should be done using the setter function instead of assignment.

ruhley commented 7 years ago

Fixed in commit 1bc32146c5a12db4dbd0193e284f3c8e8ee93857 and released in v3.4.2