Spectrum.js not initializing when used in angularjs

Question

I am using angular-spectrum-colorpicker to use spectrum.js in my code. It works basically fine except the value is not initialized with model. The following is the settings I used:

<spectrum-colorpicker ng-model="backgroundColor"
                        options="{
                                 flat: true,
                                 preferredFormat: 'hex',
                                 showInput: true,
                                 showButtons: false,
                                 clickoutFiresChange: true,
                                 }">
</spectrum-colorpicker>

And here is a jsbin to demostrate the problem. You can see that it works fine except the color is not correctly initialized at the beginning. You may reproduce the error by toggling the output pannel.

JSBin

What have I missed or is it a bug that I should report on github?

Answer 1

How about passing color by option?

  <spectrum-colorpicker ng-model="backgroundColor"
                        options="{
                                 color: backgroundColor,
                                 flat: true,
                                 preferredFormat: 'hex',
                                 showInput: true,
                                 showButtons: false,
                                 clickoutFiresChange: true,
                                 }">