AngularJS small test, help me find the error please

Question

http://codepen.io/rcidaleassumpo/pen/ogvoQy

Hello, the code is on the site above.

Thats the HTML

  <div ng-app="testApp" ng-controller="myController">
  <select name="current" id="current" ng-model="currentliga">
      <option ng-repeat="liga in ligas">{{ liga }}</option>
  </select>

  {{ valor | currency:"R$" }}
  </div>

Thats the JS:

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

  app.controller('myController', function($scope){
     $scope.ligas = ['Bronze', 'Prata', 'Ouro', 'Platina', 'Diamante'];
     var preco = $scope.currentliga;
      switch(preco){
        case 'Bronze':
          $scope.valor = 24;
          break;
      }
   });

So basically my idea is to get the value from $scope.currentLiga, which is linked with the what the person will set as an option, and then return a value for the "preco" that will change the "valor" So, if its 'Bronze" that the people selects, the $scope.valor should change to 24. What am I missing? Thank you

Answer 1

Use $watch :

 var app = angular.module('testApp', []); app.controller('myController', function($scope) { $scope.ligas = ['Bronze', 'Prata', 'Ouro', 'Platina', 'Diamante']; $scope.$watch('currentliga', function(newValue, oldValue) { switch (newValue) { case 'Bronze': $scope.valor = 24; break; } }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="testApp" ng-controller="myController"> <select name="current" id="current" ng-model="currentliga"> <option ng-repeat="liga in ligas">{{ liga }}</option> </select> {{ valor | currency:"R$" }} </div>