SRK
SRK

Reputation: 163

Is there any other way to define Toaster

I am new to Angular js. I am trying to display the error message view toaster(). I searched on google, but I didn't find the proper result. When I click on the cancel() button, I will get an error saying toaster is not defined.

Html : <button class="btn btn-secondary" ng-show="editMode" ng-click="toggle_cancel()"> Cancel </button>

Angular Js :

 $scope.toggle_erase = function(information){
      toastr.toggle_erase('Are you sure want to delete ?')
       $scope.hideDelay(3000):
}

Upvotes: 1

Views: 364

Answers (2)

Raghav
Raghav

Reputation: 1229

You need to include toastr.js and toastr.css files.. Please check the example

// Code goes here

var app = angular.module('myapp',['toastr']);

app.controller('demo',function($scope,toastr){
  $scope.toggle_remove = function(){
    toastr.info('Hello!!');
    toastr.refreshTimer(toastr, 3000);
  }
});
    <link rel="stylesheet" href="style.css">
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
    <script src="https://npmcdn.com/angular-toastr/dist/angular-toastr.tpls.js"></script>
		<link rel="stylesheet" href="https://npmcdn.com/angular-toastr/dist/angular-toastr.css" />
    <script src="script.js"></script>
  </head>

  <div ng-app="myapp">
    <div class="container" ng-controller="demo">
      <button class="btn btn-secodary" ng-hide="editMode" ng-click="toggle_remove()"> Delete </button> <br/>
  </div>
  </div>

Please go through http://angular-js.in/angular-toastr/

Upvotes: 1

Rahul Pawar
Rahul Pawar

Reputation: 1036

In javascript : Your have to include respective toastr.js & toastr.css file in you project

   //cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js
   //cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css

and then use like below :

$.ajax({
        url: url
        type: "POST",
        data: data,
        async: false,
        success: function(response) {
        toastr.success('your success msg');
        }
        error : function(response){
        toastr.error('your error msg');
        }

       });

for more details refer below link : https://github.com/CodeSeven/toastr

Upvotes: 0

Related Questions