javascript - AngularJS View does not update after model update -


i have <div> on page alert message:

<div ng-controller="percentageoverridecontroller ctrl">   <script type="text/ng-template" id="alert.html">     <div class="alert" style="background-color:#fa39c3;color:white" role="alert">       <div ng-transclude></div>     </div>   </script>   <uib-alert ng-repeat="alert in alerts" type="{{alert.type}}" close="closealert($index)">{{alert.msg}}</uib-alert>   <button type="button" class='btn btn-default' ng-click="addalert()">add alert</button> </div> 

in angular controller have variable $scope.alerts = [ ] , function pushes new alert message array:

$scope.showsuccess = function(){   $scope.alerts.push({type: 'success', msg: 'threshold overrided'}); };  $scope.showerror = function(){   $scope.alerts.push({type: 'danger', msg: 'error has been happened'}); }; 

after make request , response, check in debug mode function invoked , new value added array. not appear on page.

i have test button in div:

<button type="button" class='btn btn-default' ng-click="addalert()">add alert</button> 

if press button, alert appears on page. if try invoke same function:

$scope.addalert = function() {   $scope.alerts.push({msg: 'another alert!'}); }; 

within code:

$scope.showsuccess = function(){   $scope.alerts.push({type: 'success', msg: 'threshold overrided'});   $scope.addalert(); }; 

but alert not appear on page.

i assume should trigger somehow view show update on page. think guys? thank you!

you can use $scope.apply()

$scope.showsuccess = function(){   $scope.alerts.push({type: 'success', msg: 'threshold overrided'});   $scope.addalert();   $scope.apply(); }; 

Comments

Popular posts from this blog

java - pagination of xlsx file to XSSFworkbook using apache POI -

Unlimited choices in BASH case statement -

apache - How do I stop my index.php being run twice for every user -