输入数据后重置输入字段
[英]reseting input field after entering data
问题描述
i have one input box, and im working with scanner that automatic inputs numbers when scans something, now i want to automatically assign that value to some variable, and delete it so it can get another input, any ideas? 
我有一个输入框，我正在与扫描仪一起工作，该扫描仪在扫描某物时会自动输入数字，现在我想将该值自动分配给某个变量，然后将其删除，以便可以获取另一输入，有什么想法吗？
html 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 js
.controller('PriCtrl', function($scope) {
window.onload = function() {
document.getElementById("code").focus();
};
$scope.clear= function(code){
$scope.val = code;
document.getElementById("code").value = '';
}
3 个解决方案
解决方案1
0 2016-06-13 11:35:06
just one line change 只需换一行
$scope.clear= function(code){
$scope.val = code;
$scope.code = ''; //ng-model of input is code
}
解决方案2
0 2016-06-13 11:35:35
you should read about how angular data binding is working 您应该阅读有关角度数据绑定如何工作的信息
If a variable is in the scope the view can access it. 如果变量在范围内，则视图可以访问它。 if you modify the variable value the in the controller side the view will be updated automatically and vice versa. 如果您修改变量值，则在控制器端，视图将自动更新，反之亦然。
You should avoid using jQuery as much as you can and manipulating DOM from controller like this : 您应该避免尽可能多地使用jQuery并从这样的控制器中操作DOM：
`document.getElementById("code").value = '';`
is strictly the same as $scope.code = ''; 与$scope.code = '';严格相同$scope.code = '';
this is a plunker : http://plnkr.co/edit/u3loqpxYIBMX65O9FXGD?p=preview 这是个笨蛋： http ://plnkr.co/edit/u3loqpxYIBMX65O9FXGD?p=preview
i will create a array to store the input 我将创建一个数组来存储输入
js : 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 : 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>
解决方案3
0 2016-06-13 11:36:11
In Angular, try to never do something like this document.getElementById("code").value = ''; 在Angular中，尝试从不做类似此document.getElementById("code").value = '';操作。getElementById document.getElementById("code").value = ''; . 。
You could simply watch the code variable for changes, and if it gets a new value, you copy it over into a values list and then delete the value from code . 您可以简单地查看code变量的更改，如果它获得新值，则将其复制到值列表中，然后从code删除该值。
.controller('PriCtrl', function($scope) {
$scope.$watch('code', function(newVal, oldVal) {
if (newVal != '') {
$scope.codelist.push(newVal);
$scope.code = '';
}
});
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.