在angularjs中未定义Toastr

时间:2014-03-05 22:17:48

标签: jquery angularjs undefined toastr

我正在做教程,这部分是关于实现登录,这应该给出关于登录成功的气球

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

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

我得到了这个,我不明白它。似乎加载了所有.js文件。请告诉我问题在哪里,谢谢。

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

3 个答案:

答案 0 :(得分:19)

查看toastr sources看起来像getOptions()调用jQuery的$.extend()方法。

Toastr从github自述文件的第一行开始依赖于jQuery:

  

toastr是一个用于非阻止通知的Javascript库。的的jQuery   是必需的。目标是创建一个简单的核心库   定制和扩展。

只需在主视图html中包含jquery即可。

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

答案 1 :(得分:0)

我在使用自动化任务时遇到此问题,然后在浏览器中加载。我升级了浏览器同步并修复了它。

答案 2 :(得分:0)

我遇到了这个问题,事实证明Toastr需要JQuery才能工作,请始终确保您在Toastr之前包含JQuery ,例如在angular.json中:

            "scripts": [
              "node_modules/jquery/dist/jquery.min.js", // Make sure this comes before
              "node_modules/toastr/build/toastr.min.js", // this one
              "node_modules/bootstrap/dist/js/bootstrap.min.js"
            ]