Angularjs $scope.$eval()…进行计算,然后双击结果并在结果字段中键入它添加的未定义数字

Angularjs $scope.$eval()…进行计算,然后双击结果并在结果字段中键入它添加的未定义数字,angularjs,Angularjs,这是一个简单的角度计算器。使用eval()面临一些问题 $scope.$eval()。进行计算,然后双击结果并在结果字段中键入它添加的未定义数字 我的js: var calculatorApp = angular.module('calculatorApp',[]); calculatorApp.controller('calculatorController',calculatorController); function calculatorController($s

这是一个简单的角度计算器。使用
eval()
面临一些问题

$scope.$eval()
。进行计算,然后双击结果并在结果字段中键入它添加的未定义数字

我的js:

    var calculatorApp = angular.module('calculatorApp',[]);
    calculatorApp.controller('calculatorController',calculatorController);
    function calculatorController($scope){
        var operation;
        $scope.value = "" ;
        $scope.resetClicked = function(){
         $scope.value = "";
        }
        $scope.numberButtonClicked = function(bttn_val){
            var toString = bttn_val.toString();
            $scope.value += toString;
        }
        $scope.operationButtonClicked = function(operation_val){
            if(($scope.value == "" || $scope.value == " - ") && (operation_val !="-")){
                    $scope.isDisabled = true;
            }else{
                    $scope.isDisabled = false;
                    $scope.value += ' ' + operation_val + ' ';
            }

        }
        $scope.enterClicked = function(){
                if($scope.value ==""){
                    alert("Please enter numbers to calculate!!");
                }else{
                $scope.value = ($scope.$eval($scope.value));
            }

        }
    }   
我的html:

<!DOCTYPE html>
<html>
<head>
    <style>     .section{clear:both;padding:0;margin:0}.col{background-color:#f4f4f4;height:20px;text-align:center;display:block;float:left;margin:1% 0 1% 1.6%}.col:first-child{margin-left:0}.col:hover{background-color:#f0f0ff}.group:before,.group:after{content:"";display:table}.group:after{clear:both}.c3of4{width:74.6%}.c1of4{width:23.8%}
    </style>
</head>
<body>
    <!-- Declare the View -->
    <div ng-app="calculatorApp" ng-controller="calculatorController" style="width:500px;color:black">
        <div class="section group"> <!-- Display the result row -->
            <div class="col c3of4">{{value}}</div>
            <div ng-click="resetClicked()" class="col c1of4">C</div>
        </div>
        <div class="section group"> <!-- Display the 1st number row -->
            <div ng-click="numberButtonClicked(1)" class="col c1of4">1</div>
            <div ng-click="numberButtonClicked(2)" class="col c1of4">2</div>
            <div ng-click="numberButtonClicked(3)" class="col c1of4">3</div>
            <div ng-click="operationButtonClicked('+')" class="col c1of4">+</div>
        </div>
        <div class="section group"> <!-- Display the 2nd number row -->
            <div ng-click="numberButtonClicked(4)" class="col c1of4">4</div>
            <div ng-click="numberButtonClicked(5)" class="col c1of4">5</div>
            <div ng-click="numberButtonClicked(6)" class="col c1of4">6</div>
            <div style="float:right" ng-click="operationButtonClicked('*')" ng-disabled="isDisabled" class="col c1of4">*</div>
        </div>
        <div class="section group"> <!-- Display the 3rd number row -->
            <div ng-click="numberButtonClicked(7)" class="col c1of4">7</div>
            <div ng-click="numberButtonClicked(8)" class="col c1of4">8</div>
            <div ng-click="numberButtonClicked(9)" class="col c1of4">9</div>
            <div ng-click="operationButtonClicked('-')" class="col c1of4">-</div>
        </div>
        <div class="section group"> <!-- Display the 3rd number row -->
            <div ng-click="numberButtonClicked(0)" class="col c1of4">0</div>
            <div ng-click="numberButtonClicked('.')" class="col c1of4">.</div>
            <div ng-click="enterClicked()" class="col c1of4">Result</div>
            <div style="float:right" ng-click="operationButtonClicked('/')" class="col c1of4">/</div>
        </div>
    </div>
</body>
</html>

.section{clear:both;padding:0;margin:0}.col{background color:#f4f4;height:20px;text align:center;display:block;float:left;margin:1%1.6%}.col:first child{margin left:0}.col悬停{background color:#f0f0f0ff}.group:before.{content:;display:table}.group:after{clear:both}.c34}.c3of4{宽度:74.6%}.c18%}
{{value}}
C
1.
2.
3.
+
4.
5.
6.
*
7.
8.
9
-
0
.
结果
/

在numberButtonClicked函数中更改脚本,如下所示:

$scope.numberButtonClicked = function(bttn_val){
   if($scope.value == undefined){
     $scope.value = "";
   }
   var toString = bttn_val.toString();
   $scope.value += toString;
}
$eval在angular js中计算表达式。
当您单击结果时,它会给您一个字符串作为结果,而不是一个角度表达式,在第二次单击结果按钮后,该表达式的计算结果为undefined。

您没有指定您的问题(例如,预期与实际行为),您已经尝试了什么,并且您的示例相当广泛。看到和