Conditionally change the DOM structure.
<ng:switch on="..."></ng:switch>
on – {*} –
expression to match against ng:switch-when.
<script> function Ctrl() { this.items = ['settings', 'home', 'other']; this.selection = this.items[0]; } </script> <div ng:controller="Ctrl"> <select ng:model="selection" ng:options="item for item in items"> </select> <tt>selection={{selection}}</tt> <hr/> <ng:switch on="selection" > <div ng:switch-when="settings">Settings Div</div> <span ng:switch-when="home">Home Span</span> <span ng:switch-default>default</span> </ng:switch> </div>
it('should start in settings', function() { expect(element('.doc-example-live ng\\:switch').text()).toEqual('Settings Div'); }); it('should change to home', function() { select('selection').option('home'); expect(element('.doc-example-live ng\\:switch').text()).toEqual('Home Span'); }); it('should select deafault', function() { select('selection').option('other'); expect(element('.doc-example-live ng\\:switch').text()).toEqual('default'); });