重置后,angular从先前的输入中检索值

时间:2016-09-30 03:08:04

标签: angularjs express reset

这是我在Angular JS中的应用程序:

http://cmpe-273-010825867-fall-2016.herokuapp.com/

问题是,当我通过单击数字按钮将值输入到两个文本中时,会输入它们。当我重置时,值会消失。 但是,当我再次使用数字按钮重新输入值时,值会在重置之前附加到值。

这是我的角度代码:

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

 myApp.controller('myController', function($scope) {


    function resetFields(){
        $scope.opReset=' ';
    }

       function add(x, y) {
         return x + y;
       }

       function sub(x, y) {
         return x - y;
       }

       function mul(x, y) {
         return x * y;
       }

       function div(x, y) {
         return x / y;
       }

       function calc(op, x, y) {
         return $scope.operators[op](parseInt(x, 10), parseInt(y));
       }

       $scope.operators = {
         '+': add,
         '-': sub,
         '*': mul,
         '/': div
       };
       $scope.op = '+';
       $scope.calc = calc;

});

我的HTML:

<div ng-app="myApp">

                <div ng-controller="myController" ng-init='isFocused=true'>

 <form>

                                    <div class="col-lg-5 col-md-8 col-sm-12 col-xs-12">
                                        <input width="100%" type="text" class="form-control" id="operand1" style="height:50px; font-size:32px" ng-model="operand1" ng-focus=' isFocused="operand1" ' value="{{opReset}}" autofocus>
                                    </div>


                                    <div class="col-lg-2 col-md-8 col-sm-12 col-xs-12 text-center" style="font-size:32px">
                                        {{op}}
                                    </div>


                                    <div class="col-lg-5 col-md-8 col-sm-12 col-xs-12">
                                        <input width="100%" type="text" class="form-control" style="height:50px; font-size:32px"  ng-model="operand2" ng-focus=' isFocused="operand2" ' id="operand2" value="{{opReset}}">
                                    </div>

                                    <script src="js/custom.js"></script>

                                </div>

                            </div>


                            <div class="col-lg-5">

                                <div class="row">

                                        <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 eqProps text-center">
                                            =
                                        </div>


                                        <div class="col-lg-9 col-md-9 col-sm-12 col-xs-12"style="font-size:32px">

                                            {{output}}

                                        </div>

                                </div>

                            </div>

                    </div>



                    <div class="row">


                        <div class="col-lg-1"></div>

                        <div class="col-lg-7">

                            <div class="row">

                                    <div class="col-lg-1 col-md-1 col-sm-1 col-xs-1"></div>
                                            <div class="col-lg-10 col-md-10 col-sm-10 col-xs-10">
                                                <div class="row-fluid">

                                                    <button class="btn btn-danger btn-fonts" type="reset" value="reset" ng-click=" opReset=resetFields() ">C</button>
                                                    <div class="btn btn-default btn-fonts" ng-repeat="n in [0]"  style="margin-left:2px" ng-click='$parent[isFocused]=$parent[isFocused]+""+n' ng-disabled='isFocused===true'>{{n}}</div>
                                                    <div class="btn btn-default btn-fonts" ng-click="output=calc(op,operand1,operand2)" style="visibility:hidden">=</div>
                                                    <div class="btn btn-primary btn-fonts" ng-click="output=calc(op,operand1,operand2)">=</div>

                     </form>

2 个答案:

答案 0 :(得分:1)

为什么使用value =&#34; operand1&#34;一点都没有?

 <input width="100%" type="text" class="form-control" id="operand1" style="height:50px; font-size:32px" ng-model="operand1" ng-focus=' isFocused="operand1" ' value="{{opReset}}" autofocus>

您可以直接使用ng-model初始化值,也可以在点击 C 按钮时将其清除。

更改文字区号以删除values

<input width="100%" type="text" class="form-control" id="operand1" style="height:50px; font-size:32px" ng-model="operand1" ng-focus=' isFocused="operand1" ' autofocus>

然后在resetFields函数中,使用:

更改值
$scope.operand1='';
$scope.operand2='';

答案 1 :(得分:-1)

请为ng-model值设置空值(operand2,operand1)