2017-11-15 8 views
0

방금 ​​Angular JS를 배우기 시작했고 선택 상자에서 작업을 선택하고 두 숫자에 대한 연산을 수행 할 수있는 간단한 calc 프로그램을 작성하려고했습니다 .AngelsJS에서 일부 작업을 수행하기 위해리스트에서 선택된 텍스트를 전달하는 방법

버튼을 사용하여이 작업을 수행 할 수 있지만 선택 상자를 사용하여 수행 할 수 없습니다.

코드의 다음 줄에 제안하십시오 :

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

    <link rel="stylesheet" href="style.css" /> 
    <script src="Jscript.js"></script> 
</head> 

<body ng-app="myApp"> 
    <h1>Hello Angular</h1> 
    <div ng-controller="MainCtrl"> 
    1st Number : <input type="text" ng-model="num1"><br/> 
    2nd Number : <input type="text" ng-model="num2"> 

     <p><select ng-model="operator"> 
      <option>+</option> 
      <option>*</option> 
      <option>-</option> 
      <option>/</option> 
     </select></p> 

    <input type="button" ng-click="add(num1,num2)" value="ADD">  <input type="button" ng-click="multiply(num1,num2)" value="Multiply"> 

    <input type="button" ng-click="subtract(num1,num2)" value="Subtract"> 
    <input type="button" ng-click="divide(num1,num2)" value="Divide"><br/> <br/> <br/> 

    Sum : {{result}} 
    <div> 
</body> 

</html> 

와 해당 JS 파일 :

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

app.controller('MainCtrl', function ($scope) 
{ 
    $scope.add = function (num1, num2) 
    { 
     $scope.result = parseInt(num1) + parseInt(num2); 
    } 

    $scope.multiply = function (num1, num2) { 
     $scope.result = parseInt(num1) * parseInt(num2); 
    } 

    $scope.subtract = function (num1, num2) { 
     $scope.result = parseInt(num1) - parseInt(num2); 
    } 

    $scope.divide = function (num1, num2) { 
     $scope.result = parseInt(num1)/parseInt(num2); 
    } 

}); 

을 지금은 드롭 다운 목록의 선택에 작업을 수행 할 대신 버튼의.

답변

0

사용 ng-change a.e : <select ng-model="operator" ng-change="onChange()">과 :

$scope.onChange = function(){ 

     switch ($scope.operator) { 
     case '+': 
      $scope.result = parseInt($scope.num1) + parseInt($scope.num2); 
      break; 
     case '-': 
      $scope.result = parseInt($scope.num1) - parseInt($scope.num2); 
      break; 
     case '/': 
      $scope.result = parseInt($scope.num1)/parseInt($scope.num2); 
      break; 
     case '*': 
      $scope.result = parseInt($scope.num1) * parseInt($scope.num2); 
      break;  

     default: 
      // code 
     } 

    } 

Plunker

+0

와우. 선택시 OnChange를 가리켜 주셔서 감사합니다. 효과가 있습니다. – user2519971

+0

@ user2519971 감사합니다. 감사합니다. 감사합니다. 감사합니다. 감사합니다. 감사합니다. 감사합니다. –