输入数据后重置输入字段

Question

我有一个输入框，我正在与扫描仪一起工作，该扫描仪在扫描某物时会自动输入数字，现在我想将该值自动分配给某个变量，然后将其删除，以便可以获取另一输入，有什么想法吗？

html

<ion-view hide-nav-bar="true">
  <ion-content class="padding"><br>

    <label class="item item-input">  
      <input type="number" ng-model="code" id="code" name="theInput" auto-focus>
    </label>

    <div class="tt"><br><br>
        Code   : <span class="art">{{code}}<br><br></span>
    </div><br>

    <button ng-click="clear(code)" class="button button-positive">
     Clear
    </button>
  </ion-content>
</ion-view>

js

 .controller('PriCtrl', function($scope) {

    window.onload = function() {
        document.getElementById("code").focus();
    };


    $scope.clear= function(code){

    $scope.val = code;

    document.getElementById("code").value = '';

}

Answer 1

只需换一行

$scope.clear= function(code){   
 $scope.val = code;
 $scope.code = ''; //ng-model of input is code
}

Answer 2

您应该阅读有关角度数据绑定如何工作的信息

如果变量在范围内，则视图可以访问它。 如果您修改变量值，则在控制器端，视图将自动更新，反之亦然。

您应该避免尽可能多地使用jQuery并从这样的控制器中操作DOM：

`document.getElementById("code").value = '';`

与$scope.code = '';严格相同$scope.code = '';

这是个笨蛋： http ://plnkr.co/edit/u3loqpxYIBMX65O9FXGD?p=preview

我将创建一个数组来存储输入

js：

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

app.controller('MainCtrl', function($scope) {

  $scope.selected = [] ;
  $scope.code = null ;
  $scope.next = function(){
    $scope.selected.push( $scope.code );
    $scope.code = null

  }
});

HTML：

<body ng-controller="MainCtrl">

 <ion-view hide-nav-bar="true">
  <ion-content class="padding"><br>

    <label class="item item-input">  
      <input type="number" ng-model="code" id="code" name="theInput" auto-focus>
    </label>

    <div class="tt"><br><br>
        Code   : <span class="art">{{code}}<br><br></span>
    </div><br>

    <button ng-click="next()" class="button button-positive">
      scan next
    </button>
  </ion-content>
</ion-view> 

<pre>{{selected|json}}</pre>


</body>

Answer 3

在Angular中，尝试从不做类似此document.getElementById("code").value = '';操作。getElementById document.getElementById("code").value = ''; 。

您可以简单地查看code变量的更改，如果它获得新值，则将其复制到值列表中，然后从code删除该值。

.controller('PriCtrl', function($scope) {
    $scope.$watch('code', function(newVal, oldVal) {
        if (newVal != '') {
            $scope.codelist.push(newVal);
            $scope.code = '';
        }
    });
}

输入数据后重置输入字段

问题描述

3 个解决方案

解决方案1
0 2016-06-13 11:35:06

解决方案2
0 2016-06-13 11:35:35

解决方案3
0 2016-06-13 11:36:11

输入数据后重置输入字段

问题描述

3 个解决方案

解决方案1 0 2016-06-13 11:35:06

解决方案2 0 2016-06-13 11:35:35

解决方案3 0 2016-06-13 11:36:11

解决方案1
0 2016-06-13 11:35:06

解决方案2
0 2016-06-13 11:35:35

解决方案3
0 2016-06-13 11:36:11