Toastr undefined in angularjs

user3123165 picture user3123165 · Mar 5, 2014 · Viewed 9.4k times · Source

I am doing tutorial and this part is about implementing login and this should give baloons about login success

angular.module("app").value("mvToastr", toastr);

angular.module("app").factory("mvNotifier", function(mvToastr) {
   return {
      notify: function(msg) {
          mvToastr.success(msg);
          console.log(msg);
       }
    }
});

I am getting this and I don't understand it a bit. All .js files seem to be loaded. Please tell me where is the problem, thank you.

TypeError: Cannot call method 'extend' of undefined
   at getOptions (http://localhost:3030/vendor/toastr/toastr.js:282:14)
   at Object.success (http://localhost:3030/vendor/toastr/toastr.js:68:17)
   at Object.notify (http://localhost:3030/app/common/mvNotifier.js:6:22)
   at http://localhost:3030/app/account/mvNavBarLoginCtrl.js:8:28
   at wrappedCallback (http://localhost:3030/vendor/angular/angular.js:11033:81)
   at wrappedCallback (http://localhost:3030/vendor/angular/angular.js:11033:81)
   at http://localhost:3030/vendor/angular/angular.js:11119:26
   at Scope.$eval (http://localhost:3030/vendor/angular/angular.js:12045:28)
   at Scope.$digest (http://localhost:3030/vendor/angular/angular.js:11871:31)
   at Scope.$apply (http://localhost:3030/vendor/angular/angular.js:12151:24)

   angular.js:9503

Answer

Phil Price picture Phil Price · Mar 6, 2014

Looking at the toastr sources it looks like getOptions() calls jQuery's $.extend() method.

Toastr takes a dependency on jQuery, from the first line of the github readme:

toastr is a Javascript library for non-blocking notifications. jQuery is required. The goal is to create a simple core library that can be customized and extended.

Just include jquery in your master view html.

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>