USE NGSWITCH IN ANGULAR JS.

Ankit Singh

Total Post:341

Points:2389
Posted by  Ankit Singh
 558  View(s)
Ratings:
Rate this:
we want to use  ngSwitch in angular js. how to use this please help me.
  1. aditya kumar Patel

    Post:254

    Points:1810
    Re: use ngSwitch in angular js.

    @{

    Layout = null;

    }

    <!DOCTYPE html>

    <html>

    <head>

    <title>Forum</title>

    <meta name="viewport" content="width=device-width" />

    <title></title>

    <script src="~/Scripts/jquery-2.1.4.js"></script>

    <script src="~/Scripts/angular.js"></script>

    <script>

    var app = angular.module('myapp', []);

    app.controller('Controller', ['$scope', function ($scope) {

    $scope.items = ['Home', 'About', 'Contact','Product'];

    $scope.selection = $scope.items[0];

    }]);

    </script>

    </head>

    <body ng-app="myapp">

    <div ng-controller="Controller" style="width:400PX;">

    <select ng-model="selection" ng-options="item for item in items">

    </select>

    <code>selection={{selection}}</code>

    <hr/>

    <div class="container"

    ng-switch on="selection">

    <div class="switch" ng-switch-when="Home">Home Div</div>

    <div class="switch" ng-switch-when="About">About Div</div>

    <div class="switch" ng-switch-when ="Contact">Contact Div</div>

    <div class="switch" ng-switch-when="Product">Product Div</div>

    </div>

    </div>

    <style>

    .container {

    position:relative;

    background:white;

    border:1px solid black;

    height:40px;

    overflow:hidden;

    width:400px;

    }

    </style>

    </body>

    </html>

     

Answer

NEWSLETTER

Enter your email address here always to be updated. We promise not to spam!