angularjs - Angular Stormpath 注入未知提供者

Question

我正在尝试使用带有风暴路径的角度 ui 路由器来获得角度，但我不断收到未知的提供程序错误。我的代码如下，

var angular = require("angular");

// app.js
var app = angular.module('app', [require('angular-ui-router'), require("stormpath-sdk-angularjs")]);

app.config(function($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise('/');
    $stateProvider
    .state('home', {
        url: '/',
        templateUrl: 'partials/home.html'
    })
    .state('about', {
        url: '/about',
        templateUrl: 'partials/about.html'
    });
})
.run(function($stormpath){
  $stormpath.uiRouter({
    loginState: 'login',
    defaultPostLoginState: 'home'
  });
});

这是错误页面，错误：$injector:unpr Unknown Provider

Answer 1

这是一个错误stormpath-sdk-angularjs，已在版本中修复0.8.2。

要让它与 browserify 一起工作，请将这些行添加到您的package.json：

"browser": {
  "stormpath": "./node_modules/stormpath-sdk-angularjs/dist/stormpath-sdk-angularjs.js",
  "stormpath.templates": "./node_modules/stormpath-sdk-angularjs/dist/stormpath-sdk-angularjs.tpls.js"
}

然后像这样要求它：

var angular = require("angular");

var app = angular.module('app', [
  require('angular-ui-router'),
  require('stormpath'),
  require('stormpath.templates')
]);

Answer 2

先前的答案可能是解决方案的一部分。也许您正在使用诸如 WebPack 之类的工具来编译您的应用程序？这些信息会很有用。请注意，Stormpath Angular SDK 在 Angular 命名空间中提供了两个模块，stormpath并且stormpath.templates. 如果使用 browserify，您可能需要使用 require('dist/stormpath-sdk-angularjs.js')

PS 我在Stormpath工作，如果您想私下与我们分享您的代码，请随时通过 support@stormpath.com 与我们联系。谢谢！

Answer 3

Stormpath 使用了错误的模块名称module.exports（我在这里提出了一个错误 ~ https://github.com/stormpath/stormpath-sdk-angularjs/issues/80）。

目前，您可以执行此操作

var angular = require("angular");
require('stormpath-sdk-angularjs');

// app.js
var app = angular.module('app', [
    require('angular-ui-router'), // this one is fine
    'stormpath',
    'stormpath.templates'
]);

Answer 4

事实证明，stormpath sdk 将自身注入到 Angular 中。解决方案是在angular之后加载库。

var angular = require("angular");
var stormpath = require("stormpath-sdk-angularjs");

var app = angular.module('app', [require('angular-ui-router'), "stormpath", "stormpath.templates"]);

app.config(function($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise('/');
    $stateProvider
    //States Here
})
.run(function($stormpath){
    $stormpath.uiRouter({
        loginState: 'login',
        defaultPostLoginState: 'home'
    });
});

Answer 5

通常，您不会以这种方式在角度依赖列表中使用 require() 。相反，您需要：

var app = angular.module('app', ['ui-router','stormpath']);

确保正确包含两个库。