Flip switches do not have label when using ng-options

[rodcloutier]

When using the ng-options in a select form element that uses the data-role="slider", the labels are not displayed

See fiddle http://jsfiddle.net/sMksx/2/

[tbosch]

Thanks for reporting!

[tbosch]

Hi,
thanks for your pull request!
However, I think this solution is not the whole thing. If someone changes the values of ng-options after the slider was created, we cannot react to it as the refresh function of slider does not re-read the options. The right thing to do would be to detect changes to children (via the $childrenChanged event of the adapter) and recreate the widget in that case...
In total, this is a bug in jquery mobile, as the refresh function of the slider widget should be able to adjust to changed options...

Tobias

[rodcloutier]

But in the meantime, wouldn't it be better to at least display the label. It would make flip switch that do not change the value of ng-options. As it stands, we cannot use flip switches at all.

[tbosch]

Hi,
mmh... You can use flip switches with <option> entries... However, I haven't checked if it's possible to use ng-repeat on the options...

[rodcloutier]

Angular strongly suggest using ng-options and avoid using ng-repeat on the options. See the following Angularjs issue angular/angular.js#639

I also updated a fiddle to show that none of the option work
http://jsfiddle.net/rodcloutier/sMksx/6/

[tbosch]

Hi,
thanks for checking on the details of ng-options!
With the last commit, all of your examples are working: http://jsfiddle.net/sMksx/7/

I implemented it as discussed: The slider will take the initial values of ng-options and ng-repeat. Changing the options afterwards does not change the slider though.

Thanks for reporting and your pull request! Hope it will be easier next time now that we have testacular and travis-ci...

Tobias

[rodcloutier]

Unless I am misunderstanding how to use ngm-shared-controller but flip switches are not working when using a shared controller.

See fiddle http://jsfiddle.net/rodcloutier/sMksx/8/

[tbosch]

Hi,
if you are using shared controllers, you have to give your controller a prefix, e.g. ngm-shared-controller="main:MainController" instead of ngm-shared-controller="MainController". And then use this prefix in your page, e.g. main.options. Your jsfiddle shows a console error from ngm-shared-controller that complains about this missing prefix.
Here is a corrected version: http://jsfiddle.net/sMksx/9/

Tobias