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
Post a Comment