条带角度依赖项注入错误未知提供程序:

Question

我正在将stripe angular注入到一个模块中以创建stripe令牌，但我似乎遇到了一些依赖性注入问题：

我已经在index.html 中加载了Stripe.js和angular Stripe指令

<!-- Stripe includes-->
<script type="text/javascript" src="https://js.stripe.com/v2/"></script>
<script type="text/javascript" src="components/stripe-angular/stripe-angular.js"></script>
<!-- Ends Stripe includes -->
<script src="app.js"></script>
<script src="javascripts/form.js"></script>
<script src="factory/appointments.js"></script>
<!-- <script src="directives/datepicker.js"></script>
 --><script src="controllers/main.js"></script>
<script src="controllers/form-controller.js"></script>

我根据文档正确地注入：

angular.module('formApp')
.controller('formController', ['$scope', 'Appointment', 'stripe' , function($scope, Appointment) {
Stripe.setPublishableKey('my-key-here');
}]);

我做错了什么？

这是我的错误

Error: [$injector:unpr] Unknown provider: stripeProvider <- stripe <- formController
http://errors.angularjs.org/1.3.14/$injector/unpr?p0=stripeProvider%20%3C-<div ui-view="" class="ng-scope">tripe%20%3C-%formController 

Answer 1

您将stripe列为依赖项，但从不将其传递到您的函数中：

.controller('formController', ['$scope', 'Appointment', 'stripe' , function($scope, Appointment) {

只需添加一个stripe参数：

.controller('formController', ['$scope', 'Appointment', 'stripe' , function($scope, Appointment, stripe) {

Answer 2

你的意思是angular-stripe directive吗https://github.com/gtramontina/stripe-angular？

如果是这样，你就误解了它的用法（是的，它的文档很差）。您应该将stripe添加为模块依赖项，而不是要注入的服务。将app.js中的代码更改为以下内容：

angular.module('formApp', ['stripe']);

并且去除注射公告中的stripe，那么你就可以走了。

您可能还需要将Stripe.setPublishableKey('your-publishable-key');添加到合适的位置，可能是run块或config块。

Answer 3

文档很好。

首先确保您正在加载所需的文件：

<script src="https://js.stripe.com/v2/"></script>
<script src="/vendor/angular/angular.js"></script>
<script src="/vendor/angular-stripe/release/angular-stripe.js"></script>

然后将angular-stripe模块添加到您的应用程序中：

angular.module('app', [ 'angular-stripe']...

在配置块中加载stripeProvider，并使用Stripe API密钥对其进行初始化。

angular.module('app').config(function(stripeProvider) {
  stripeProvider.setPublishableKey('yourapikey');
  ....

最后你可以在你的控制器中使用这个：

angular.module('app').controller('CheckoutCtrl', function(stripe) {
    stripe.card.createToken(card) ...

确保完成所有这些步骤。根据您的错误消息，我猜测您没有加载angular-stripe' module in your app which would then cause any call to stripeProvider`以导致该错误失败。