How to write Switch Statement in angularJS Controller

Question

How to write Switch Statement in angularJS Controller ?

My Source Code is

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="customersCtrl"> 

<table>
  <tr ng-repeat="x in names">
    <td>{{ x.Name }}</td>
    <td><a href="" ng-click="SwitchFuction(x.Name, x.Sno)">{{ x.Country }}</a></td>
  </tr>
</table>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {

    $scope.names = [
        { Sno: '1', Name: 'Jani', Country: 'Norway' },
        { Sno: '2', Name: 'Hege', Country: 'Sweden' },
        { Sno: '3', Name: 'Kai', Country: 'Denmark' }
    ];

    $scope.SuperFunction = function (id) {
        alert(id);
    };

    $scope.SwitchFuction = function (name, sno) {
        switch (sno) {
            case '1'
                alert("1. Selected Name: " + name );
                break;
            case '2'
                alert("2. Selected Name: " + name );
                break;
            default:

        }
    };

});
</script>

</body>
</html>

How to Write the Switch Statement within the function SwitchFuction ??? In the above Source Code contains some semantic error. Kindly assist how to write the Switch Statement?

The Error Screen :

Can you provide plunker?

Tushar
– Tushar

2015-12-07 10:37:14 +00:00
Commented Dec 7, 2015 at 10:37 — Tushar
– Tushar, Commented Dec 7, 2015 at 10:37

vpsingh016 · Accepted Answer · 2015-12-07 11:01:13Z

38

there is a syntax error in your SwitchFunction after each case : is missing correct code:

$scope.SwitchFuction = function (id, caseStr) {
        switch (caseStr) {
            case '1':
                alert("Selected Case Number is 1");
                break;
            case '2':
                alert("Selected Case Number is 2");
                break;
            default:

        }
    };

answered Dec 7, 2015 at 11:01

vpsingh016

7035 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Vivek · Accepted Answer · 2015-12-07 10:42:28Z

3

AngularJS is built on top of JavaScript and it has no different syntax for switch case than JavaScript(As long as you are using it in script). JavaScript support switch case statements with following syntax.

switch (expression) {
  case value1:
    //Statements executed when the result of expression matches value1
    [break;]
  case value2:
    //Statements executed when the result of expression matches value2
    [break;]
  ...
  case valueN:
    //Statements executed when the result of expression matches valueN
    [break;]
  default:
    //Statements executed when none of the values match the value of the expression
    [break;]
}

Reference

answered Dec 7, 2015 at 10:42

Vivek

13.6k19 gold badges101 silver badges139 bronze badges

6 Comments

B.Balamanigandan Over a year ago

Ok. Then whats wrong in my above script? Kindly assist my Script to make bug free...

B.Balamanigandan Over a year ago

I attached the Screen Shot. Kindly refer it.

B.Balamanigandan Over a year ago

Without Switch Statement it works fine and it shows the List otherwise it shows the Screen as like the Screenshot.

Vivek Over a year ago

Screenshot is not proper

B.Balamanigandan Over a year ago

The output of the above Source Code is {{ x.Name }} {{ x.Country }}

|

DeviD · Accepted Answer · 2016-02-18 07:32:56Z

3

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body>

  <div ng-app="myApp" ng-controller="customersCtrl">

    <table>
      <tr ng-repeat="x in names">
        <td>{{ x.Name }}</td>
        <td><a href="" ng-click=SwitchFuction(x.Name,$index)>{{ x.Country }}</a>
        </td>
      </tr>
    </table>

  </div>

  <script>
    var app = angular.module('myApp', []);
    app.controller('customersCtrl', function($scope) {

      $scope.names = [{
        Name: 'Jani',
        Country: 'Norway'
      }, {
        Name: 'Hege',
        Country: 'Sweden'
      }, {
        Name: 'Kai',
        Country: 'Denmark'
      }];

      $scope.SuperFunction = function(id) {
        alert(id);
      };

      $scope.SwitchFuction = function(id, caseStr) {
        switch (caseStr) {
          case 0:
            alert("Selected Case Number is 0");
            break;
          case 1:
            alert("Selected Case Number is 1");
            break;
          default:
            alert("Selected Case Number is other than 0 and 1");
            break;

        }
      };

    });
  </script>

</body>

</html>

Here is the Plunker

answered Feb 18, 2016 at 7:32

DeviD

311 bronze badge

1 Comment

DeviD Over a year ago

above is the syntax corrected code of the asked question. Here the java script switch and argument passing are discussed. read more about $index at : here

Collectives™ on Stack Overflow

How to write Switch Statement in angularJS Controller

3 Answers 3

Comments

6 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

6 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related