WEB DEVELOPER SITE
HTMLCSSJAVASCRIPTSQLPHPBOOTSTRAPJQUERYANGULARXML
 

AngularJS ng-switch Directive


Example

Show a segment of HTML, just in the event that it coordinates a certain value:

<div ng-switch="myVar">
  <div ng-switch-when="dogs">
    <h1>Dogs</h1>
    <p>Welcome to a universe of dogs.</p>
  </div>
  <div ng-switch-when="tuts">
    <h1>Tutorials</h1>
    <p>Learn from examples.</p>
  </div>
  <div ng-switch-when="cars">
    <h1>Cars</h1>
    <p>Read about cars.</p>
  </div>
  <div ng-switch-default>
    <h1>Switch</h1>
    <p>Select point from the dropdown, to switch the substance of this DIV.</p>
  </div>
</div>
Try it yourself »

Definition and Usage

The ng-switch order gives you a chance to shroud/show HTML components contingent upon an expression.

Child components with the ng-switch-when order will be shown on the off chance that it gets a match, generally the component, and it's youngsters will be removed.

You can likewise characterize a default segment, by utilizing the ng-switch-default mandate, to demonstrate an area if non of alternate segments get a match.


Syntax

<element ng-switch="expression">
  <element ng-switch-when="value"></element>
  <element ng-switch-when="value"></element>
  <element ng-switch-when="value"></element>
  <element ng-switch-default></element>
</element>

Supported by all HTML elements.


Parameter Values

Value Description
expression An articulation that will evacuate components with no match, and show components with a match.