javascript - Variable is not reflecting update in view when variable is updated in the function -


i have angular app i'm trying update variable in view using function.

in view have:

<form ng-controller="scanctrl">     <div ng-click="method()">button</div>     <p>{{alert}}</p>     <p>{{working}}</p> </form> 

in controller have:

.controller('scanctrl', function($scope, qb){     $scope.working = 'this update works';     $scope.method = function(){         $scope.alert = 'this 1 doesn't';     };  }); 

the "working" variable updated correctly, if clicked div, alert doesn't seem updated in view.

i tried $scope.apply , throws error.

here full code of controller:

nojquery  .controller('scanctrl', function($scope, qb){     $scope.scan = [];      $scope.scan_code = function(){         console.log("scan function reached");         if (typeof $scope.scan.action != 'undefined') {             console.log($scope.scan.action);         } else  {             console.log("action not chosen");             $scope.scan.alert = 'please choose action!';             $scope.$apply();         }     };      $scope.$on('$ionicview.beforeenter', function(e) {         qb.authorize().then(function(authorizeresponse) {             if (authorizeresponse.ticket) {                 console.log("scanning");             } else {                 qb.nav('login');             }         });     }); }); 

and here of view:

<ion-view view-title="scan">     <ion-content class="padding">         <h2>warehouse</h2>         <h4>{{data.warehouse}}</h4>         <h2>item check in/out</h2>         <form ng-controller="scanctrl">         <ion-radio name="action" ng-model='scan.action' value="add">add item vehicle</ion-radio>         <ion-radio name="action" ng-model='scan.action' value="rem">remove item vehicle</ion-radio>         <button class="button button-full button-positive" ng-click="scan_code()">scan</button>         </form>         <ion-item>             <p class="assertive">{{scan.alert}}</p>             <h2>{{data.scanneditems.model_details}}</h2>             <p>{{data.scanneditems.classification_details}}</p>         </ion-item>     </ion-content> </ion-view> 

the problem controller's scope <form>...</form> element, , placing alert outside of scope in template.

either move <p> element alert within form, or place ng-controller attribute on parent node includes it.

please see the plunker code.


Comments

Popular posts from this blog

c# - How Configure Devart dotConnect for SQLite Code First? -

c++ - Clear the memory after returning a vector in a function -

erlang - Saving a digraph to mnesia is hindered because of its side-effects -