2016-06-13 4 views
0

У меня есть одно поле ввода, а im работает со сканером, который автоматически вводит числа при сканировании чего-то, теперь я хочу автоматически назначить это значение некоторой переменной и удалить его, чтобы он мог получить другой вход, есть идеи?Сброс поля ввода после ввода данных

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 = ''; 

} 
+0

Сканирует ли сканер символ «возврат» в конце ввода (обычно они)? если это так, то мы отправим форму, чтобы вы могли добавить 'ng-submit' в форму для чтения' $ scope.code', сделать с ней что-то, а затем сбросить ее до пустого. – Rhumborl

ответ

0

только одно изменение линии

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

вы должны прочитать о том, как угловая привязка данных работает

Если переменная находится в sc ope view может получить к нему доступ. если вы измените значение переменной на стороне контроллера, представление будет автоматически обновлено и наоборот.

Вы должны избегать использования JQuery столько, сколько вы можете и манипулировать DOM из контроллера, как это:

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

строго такой же, как $scope.code = '';


это plunker: http://plnkr.co/edit/u3loqpxYIBMX65O9FXGD?p=preview

Я создам массив для хранения ввода

ЯШ:

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> 
+0

все в порядке, но есть ли способ автоматизировать его без кнопки? что-то вроде: число отсканировано - сохранить номер, clear(); – Mark

+0

да конечно, см. @ C14L ответ. ваш сканер заполняет вход самостоятельно? – AlainIb

+0

Да, не работает по его совету – Mark

0

В Угловое, попытайтесь никогда не сделать что-то вроде этого document.getElementById("code").value = '';.

Вы можете просто просмотреть переменную code для изменений, и если она получит новое значение, вы скопируете ее в список значений, а затем удалите значение из code.

.controller('PriCtrl', function($scope) { 
    $scope.$watch('code', function(newVal, oldVal) { 
     if (newVal != '') { 
      $scope.codelist.push(newVal); 
      $scope.code = ''; 
     } 
    }); 
} 
Смежные вопросы