ng-switch in angularjs | ng-switch

what is ng-switch

Ng-switch is conditional directives which swap (show and hide) DOM elements according to expression. We use ng-switch-when to check conditions and ng-switch-default to put default condition.

ng-switch example

In the following example we are going to find out the vowels using ng-switch.

It is vowel It is vowel It is vowel It is vowel It is vowel It is empty It is constant


<div ng-app>
    <input type="text" data-ng-model="n1">
    
    //switch the variable
    
    <div data-ng-switch="n1">
        <div data-ng-switch-when="a">It is vowel</div>
        <div data-ng-switch-when="i">It is vowel</div>
        <div data-ng-switch-when="e">It is vowel</div>
        <div data-ng-switch-when="o">It is vowel</div>
        <div data-ng-switch-when="u">It is vowel</div>
        <div data-ng-switch-default>It is constant</div>
    </div>
<script src="angular.js"></script>    
</div>