angularjs ui-router:未知提供者:$ stateProvider

Question

我在使用AngularJS的ui-router插件时遇到了麻烦:

angular.module('myApp', []).
config(['$routeProvider', '$stateProvider', function($routeProvider, $stateProvider) {  
    $stateProvider
        .state('mandats', {
            url: '/domiciliations/mandats',
            templateUrl: 'domiciliations/views/mandats.html',
            controller: 'mandatsCtrl'
        });
}])

然后我在启动时收到此错误:

Unknown provider: $stateProvider

我按此顺序包含了javascripts:

<script src="/Scripts/libs/angular/angular.js"></script>
<script src="/Scripts/libs/angular/angular-resource.js"></script>
<script src="/Scripts/libs/angular/angular-ui-states.js"></script>

可能是什么问题 ？

[编辑]

我通过添加'ui.compat'作为myApp的依赖项来摆脱错误消息.我在ui-router的示例代码中看到了这一点,但在文档中没有.这是关于什么的？

尽管如此,它仍然无效.我已将ui-view添加到应用程序索引文件中的div.但页面仍然是空白的.

Answer 1

以下代码应该可以完成这项工作.至少在我的情况下,让我知道它是否有效.

angular.module('myApp', ['ui.compat']).
config(['$routeProvider', '$stateProvider', function($routeProvider, $stateProvider) {  
    $stateProvider
        .state('mandats', {
            url: '/domiciliations/mandats',
            templateUrl: 'domiciliations/views/mandats.html',
            controller: 'mandatsCtrl'
        });
}])

现在关于您的页面为空的问题.确保浏览器中的URL与您所在州的任何URL不匹配.在浏览器中尝试这个'#/ domiciliations/mandats',看看视图是否得到了适当的渲染.并不是说你的绝对网址应该与http:// [HOST_NAME] /home.html#/domiciliations/mandats类似.

Answer 2

您只需要将ui-router模块包含为依赖项.

喜欢以下

angular
    .module('myApp', ["ui.router"])
    .config(['$routeProvider', '$stateProvider', function($routeProvider, $stateProvider) { 
        ...
    }]);