Venkat Venkat - 1 year ago 61
AngularJS Question

angular 1 toaster not showing when i call on constructor

I am trying to use angular-toaster when any page is loaded.
Eg - i have two pages customer-add and customer-list, my requirement is to show toaster on customer list page when i add any new customer.

Here is my code: code in saveCustomer call back

this.$state.go('app.Customers', { Msg: d.Message });


Code in customer-list page:
html:

<toaster-container toaster-options="{'position-class': 'toast-top-right', 'close-button':true}"></toaster-container>


JS:

static $inject=['toaster']
constructor( private toaster: any){
if (this.$stateParams.Msg !== null)
this.msgToClient = this.$stateParams.Msg;
this.toaster.pop('success', 'Success', this.msgToClient);
}


I am not seeing this message on customer-list page.
But i can see toaster messages in events like (click) . i tried many ways but no luck.

Answer Source

I've already encounter that problem. I know it's not elegant but I solved it this way:

setTimeout(function(){ 
    toaster.pop('success', 'Success', 'Page Load'); 
    $scope.$apply();
}, 100);

https://plnkr.co/edit/8P8E7NPeYa0wP2fGXleF?p=preview

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download