angular.widget.ng:switch
Description
Conditionally change the DOM structure.
Usage
In HTML Template Binding
<ng:switch on="...">
<any ng:switch-when="matchValue1">...</any>
<any ng:switch-when="matchValue2">...</any>
...
<any ng:switch-default>...</any>
</ng:switch>
Parameters
- on –
{*}
– expression to match against ng:switch-when.
On child elments add:
ng:switch-when
: the case statement to match against. If match then this
case will be displayed.
ng:switch-default
: the default case when no other casses match.
Example
<select name="switch">
<option>settings</option>
<option>home</option>
<option>other</option>
</select>
<tt>switch={{switch}}</tt>
</hr>
<ng:switch on="switch" >
<div ng:switch-when="settings">Settings Div</div>
<span ng:switch-when="home">Home Span</span>
<span ng:switch-default>default</span>
</ng:switch>
</code>
it('should start in settings', function(){
expect(element('.doc-example ng\\:switch').text()).toEqual('Settings Div');
});
it('should change to home', function(){
select('switch').option('home');
expect(element('.doc-example ng\\:switch').text()).toEqual('Home Span');
});
it('should select deafault', function(){
select('switch').option('other');
expect(element('.doc-example ng\\:switch').text()).toEqual('default');
});