Possible bug using using ng-switch with Select tag in AngularJS

The Select tag I am using in conjunction with ng-switch does not properly display nor function properly after being set once.

                <select ng-model="visuals" ng-options="visual for visual in visuals">                      

See JSFiddle: http://jsfiddle.net/timothybone/UaFuc/3/

Thanks in advance! :D

You should not bind visuals using ng-model as it is the list of items. Setting it replace the list value by the chosen item (which is a list of characters). Causing the strange behaviour.

<select ng-model="item" ng-options="visual for visual in visuals"> 

This new variable must be declared in the scope. It is also used to set an initial value:

$scope.item = 'none';

Your switch usage was also wrong, you need en enclose condition in the switching block.

  <div ng-switch on="item">
      <span ng-switch-when="lots">Youtube</span>
      <span ng-switch-default></span>
  </div>

If you want to set the content of the HTML using ng-bind-html-unsafe you should provide a variable as parameter (not sure how you could inject javascript that way).

<span ng-switch-when="lots" ng-bind-html-unsafe="youtube">Could not evaluate 'youtube' variable</span>

The span content is then replaced. Of course a new variable must be defined in the scope to hold the HTML content:

$scope.youtube = "<hr/>This is an HTML content<hr/>";

I updated the jsFiddle: http://jsfiddle.net/PMpLa/4/