Toastr 不能与 AngularJs 结合使用

Question

我正在尝试将Toastr 与angular js 一起使用，但出现以下错误。我按预期包含了jquery.js 文件。

src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"

错误信息：

angular.js:11594 TypeError: Cannot read property 'extend' of undefined

在 m (toastr.js:474)
在 Object.o [作为信息] (toastr.js:474)
在 ProductTableController.showAddToCartToast (productTable.directive.js:207)
在 ProductTableController.addToCart (productTable.directive.js:159)
在 angular.js:12332
在 f (angular.js:22949)
在 a.$$ChildScope.$$ChildScope.$eval (angular.js:14383) 在 a.$$ChildScope.$$ChildScope.$apply (angular.js:14482) 在 HTMLButtonElement。 (angular.js:22954) 在 HTMLButtonElement.dispatch (jquery.js:4670)(匿名函数) @ angular.js:11594(匿名函数) @ angular.js:8544$apply @ angular.js:14484(匿名函数) @ angular.js:22954dispatch @ jquery.js:4670r.handle@jquery.js:4338

知道有什么问题吗？

谢谢。

Answer 1

我认为您在 angular.js 之后包含了 Jquery 文件。将您的 Jquery 文件移到 Angularjs 文件上方。

例如。

1. <script src ="jquery.min.js"></script>
2. <script src ="angular.min.js"></script>

Answer 2

您可以改用angular-toastr 库

安装：bower install angular-toastr

包含依赖：angular.module('app', ['ngAnimate', 'toastr'])

在控制器中使用：

app.controller('foo', function($scope, toastr) {
  toastr.success('Hello world!', 'Toastr fun!');
});