ng-switch inside ng-repeat Angularjs

Question

i have question how to use ng-switch inside ng-repeat and use scope for switch-on ?

example :

 <div ng-repeat="item in submenu">
            <div class="animate-switch"  ng-switch-when="{{item.filter}}">
                <div class="navbar navbar-default navbar-static-top {{item.filter}}">
                    <div  class="navbar-collapse collapse" id="navbar-{{item.filter}}">
                        <ul class="nav navbar-nav subnav">
                            <li ng-repeat="subitem in item.sub" class="items"  >
                                <a ng-href="{{subitem.link}}" class="{{selected }}" ng-click="selectfiltersub(subitem.filter)">{{item.name}}</a>
                            </li>
                        </ul>
                    </div>

                </div>
            </div>
        </div>

$scope.submenu :

 $scope.submenu =[{
            name:'Glasba',
            filter:'music',
            sub:[{
                name:'Koncerti',
                filter:'Concerts'
            },{
                name:'Klasika',
                filter:'Clasic'
            },{
                name:'Elektronika',
                filter:'Elektro'
            },{
                name:'Indy',
                filter:'Indy'
            },{
                name:'Teater',
                filter:'Theater'
            }]
        }]

so the problem is on ng-switch-when = "{{item.filter}}" <-- does not recognize. the output is the same as code ng-swith-when="{{item.filter}}" insted of music. What can i do ? thx for anwsers !

exmaple picture <--upper is menu and udner 50px height is submenu with no content now ...

Answer 1

From ng-switch documentation:

Be aware that the attribute values to match against cannot be expressions. They are interpreted as literal string values to match against. For example, ng-switch-when="someVal" will match against the string "someVal" not against the value of the expression $scope.someVal.

Look into using ng-if instead:

<div class="animate-switch"  ng-if="item.filter === 'music'">
  filter equals 'music'
</div>