Question

我有一个基本的附加计算器，如下所示：

<!DOCTYPE html>
<html ng-app>
<head>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js">
</script> 
</head>
<body>    
    <input type="number" ng-model="input1" /> + <input type="number" ng-model="input2" /> = <input type="number" ng-model="input1 + input2" />
</body>
</html>

看起来像这样：

2 + 3 = 5

我现在需要使第三个输入可编辑，并且在更改时它会更改第一个输入中的值，以便数字相加。所以在上面的例子中，假设我将5更改为6，它将如下所示：

3 + 3 = 6

但是因为第三个输入的模型是计算我无法编辑它。请有人可以建议我如何才能使所有三个输入都可编辑但仍能执行所需的计算？

Answer 1

您需要响应控制器上输入的ng-change事件

＆＃13;

<html ng-app="app">
<head>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.js">
</script>
</head>
<body ng-controller="ctrl">
    <input type="number" ng-model="input1" ng-change="calc()"/> + <input type="number" ng-model="input2" ng-change="calc()"/> = <input type="number" ng-model="result" ng-change="recalc()" />
</body>

<script type="text/javascript">

  angular.module('app',[]).controller('ctrl',function($scope){

    
    $scope.recalc = function(){

      $scope.input1 = $scope.result - $scope.input2;

    };

    $scope.calc = function(){
      $scope.result = $scope.input1 + $scope.input2;
    }

  });

</script>
</html>

＆＃13;

Answer 2

另一种方法：D

for jj=1:1:ng
  Fp(jj)=eval(sprintf('Fp%d',jj));
end

当编辑任何一个框时，它反映了变化......

AngularJS - 允许计算输入可编辑

2 个答案: