[SOLVED] Input value not updating


#1

Hey guys dont know if this is a bug or i’d doing something wrong. (I’m new to both ionic and angular)
I’m using ngCordovas Barcode Scanner and I’m trying to update the value of an input field.

<label for="barcode_value" class="item item-input" ng-click="barcodescanner()">
 <i class="icon ion-ios7-barcode-outline placeholder-icon"></i>
 <input type="text" placeholder="barcode_value" name="barcode_value" value="{{barcode_value}}">
</label>

app.js

$scope.barcodescanner = function(){
	$cordovaBarcodeScanner.scan().then(function(imageData){
		$scope.barcode_value = imageData.text;
	}, function(error){
		alert(error);
	})
}

but the value doesnt seam to update.
I tested to see if it is actually returning the value and it is.

Can anyone help me with this?


#2

if you want to connect input-fields with a scope-variable use ng-model and dismiss the value-attribute.
<input ... ng-model="barcode_value" name="barcode_value">

And to be aware scope-issues (overwriting scope variables and so on).
Put such ng-model values on an object:
$scope.barcode = { value: .... };
<input ... ng-model="barcode_value" name="barcode.value">

And another tip sometimes plugins or you on your own are using native javascript events.
This events are handled out of the angular context.
Like you do something like $(…).on(‘touchstart’, function () {});
All scope changes in the callback function of that event will not be recognized from angular.
To see the updates use $timeout
example

$(...).on('touchstart', function () {
   $timeout(function () {
       $scope.myvalue = 'test';
    });
});

You should also use $timeout instead of native setTimeout function (in most cases… sometimes you can not go with $timeout).

greetz


#3

Here is my solution for the scope issue:

change $scope.barcode_value to  $scope.barcode.value (it's important to use a dot)
add $scope.barcode = [] to the top of your controller

Try this it should work


#4

yeah that is what i meant with $scope.barcode = { value : ‘’ };

But yours maybe work but is not correct.

$scope.barcode = [] -> declares an array -> implizit an object, but you want to use it as an ordinary object so you have to do the this:
$scope.barcode = {};