Angular dropdown menu I've made a dropdown menu using angularJS, it works fine but I feel that I'm not following the DRY principle. Is there a way to combine this switch statement into something more efficient with less code? Instead of having 3 "cases" can I just use an OR operator inside of a data-ng-switch-when or something like that? This code will get bigger because it's quite a big project so code efficiency is key.

&lt;ul id="main-menu"&gt;
    &lt;li data-ng-repeat="item in mainMenu" data-ng-switch on="item"&gt;&lt;a href="{{item}}.php"&gt;{{item}}&lt;/a&gt;

        &lt;ul data-ng-switch-when="Meddelanden"&gt;
            &lt;li data-ng-repeat="subitem in subMenu.messages"&gt;&lt;a href="{{subitem}}.php"&gt;{{subitem}}&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;

        &lt;ul data-ng-switch-when="Mina sidor"&gt;
            &lt;li data-ng-repeat="subitem in subMenu.myPages"&gt;&lt;a href="{{subitem}}.php"&gt;{{subitem}}&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;

        &lt;ul data-ng-switch-when="Verktyg"&gt;
            &lt;li data-ng-repeat="subitem in subMenu.tools"&gt;&lt;a href="{{subitem}}.php"&gt;{{subitem}}&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;

    &lt;/li&gt;
&lt;/ul&gt;


Here's my controller containing the menu items:

onlinePlatform.controller('onlinePlatformCtrl', function ($scope) {

    $scope.mainMenu = ['Startsida', 'Nyheter', 'Meddelanden', 'Mina sidor', 'Forum', 'Kalender', 'Verktyg', 'Hjälp'],
    $scope.subMenu = {
        messages: ['Inkorg', 'Skickat', 'Borttaget'],
        myPages: ['Mina kurser', 'Mitt schema', 'Klasslista', 'Anteckningar'],
        tools: ['Ladda ner Dreamspark produkter']
    }

});
Make your menus more uniform, then you won't have to do the ng-switch-ing.  So something like

$scope.menus = [
  {
    title: 'Startsida'
  },
  {
    title: 'Messages',
    items: ['Inkorg', ...]
  },
  {
    title: 'My Pages',
    items: ['Mina kurser', ...]
  },
  ...
];


Then check whether you have the items field and if so, render the items:

&lt;ul id="main-menu"&gt;
    &lt;li data-ng-repeat="menu in menus"&gt;&lt;a href="{{menu.title}}.php"&gt;{{menu.title}}&lt;/a&gt;
        &lt;ul ng-if="menu.items"&gt;
            &lt;li data-ng-repeat="subitem in menu.items"&gt;&lt;a href="{{subitem}}.php"&gt;{{subitem}}&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
    &lt;/li&gt;
&lt;/ul&gt;


It might be worthwhile to split the URLs from the titles as well.

This approach will break down somewhat at a point when the nesting level of your menu gets too deep, because you have to add more nested lists, but until then this will keep working.