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

Multiple Color Picker instances #106

Closed kirdua1 closed 8 years ago

kirdua1 commented 8 years ago

Hi,

I need to have multiple instances of the color picker directive on the same page. I've noticed though that when I set unique ng-models for each one. If I open one then it starts working with the other one and displaying the hex value in the wrong field.

<color-picker ng-model="navbarColor" options="options" api="api" event-api="eventApi"> </color-picker>

<color-picker ng-model="navbarFontColor" options="options" api="api" event-api="eventApi"> </color-picker>

$scope.options = { required:false, disabled:false, round:false, format:'hex', hue:false, alpha:false, swatch:true, swatchPos:'left', swatchBootstrap:true, swatchOnly:false, pos:'bottom-left', case:'lower', inline:false, placeholder:'', close:{ show:true, label:'Close', class:'' } };

Is there a way to have multiple on the same page?

ruhley commented 8 years ago

The api attribute is not required, but if you do supply it each color picker needs a separate api object.