Angularjs 角度路由器解析导致未知提供程序错误

我试图使用Angular的路由来解析控制器作用域所需的对象。我已经阅读了一些关于如何执行此操作的教程，但仍然收到一个

未知提供程序

错误。问题似乎在于

project

被注入

ProjectDetailCtrl

app.js

var myApp = angular.module('myApp', ['ngRoute']);

myApp.config( function ($interpolateProvider, $routeProvider) {
    $routeProvider
    ...
    .when('/project/:projectId', {
        templateUrl : 'partials/_project_detail.html',
        controller: 'ProjectDetailCtrl',
        resolve: {
            project: function ($route, MyService) {
                return MyService.get('projects/', $route.current.params.projectId).then(function(data) {
                    console.log('VERIFY DATA: ', data);
                    return data;
                });
            }
        }

.controller('ProjectDetailCtrl', function ($scope, project) {
    $scope.project = project;
}

.factory('MyService', function ($http, $q) {

var MyService = {
    ...
    get: function (items_url, objId) {
        var defer = $q.defer();
        $http({method: 'GET', 
            url: api_url + items_url + objId}).
            success(function (data, status, headers, config) {
                defer.resolve(data);
            }).error(function (data, status, headers, config) {
                defer.reject(status);
            });
        return defer.promise;
    },

var myApp = angular.module('myApp', ['ngRoute']);

myApp.config( function ($interpolateProvider, $routeProvider) {
    $routeProvider
    ...
    .when('/project/:projectId', {
        templateUrl : 'partials/_project_detail.html',
        controller: 'ProjectDetailCtrl',
        resolve: {
            project: {title: 'foo'}
        }
     });
})

controllers.js

var myApp = angular.module('myApp', ['ngRoute']);

myApp.config( function ($interpolateProvider, $routeProvider) {
    $routeProvider
    ...
    .when('/project/:projectId', {
        templateUrl : 'partials/_project_detail.html',
        controller: 'ProjectDetailCtrl',
        resolve: {
            project: function ($route, MyService) {
                return MyService.get('projects/', $route.current.params.projectId).then(function(data) {
                    console.log('VERIFY DATA: ', data);
                    return data;
                });
            }
        }

.controller('ProjectDetailCtrl', function ($scope, project) {
    $scope.project = project;
}

.factory('MyService', function ($http, $q) {

var MyService = {
    ...
    get: function (items_url, objId) {
        var defer = $q.defer();
        $http({method: 'GET', 
            url: api_url + items_url + objId}).
            success(function (data, status, headers, config) {
                defer.resolve(data);
            }).error(function (data, status, headers, config) {
                defer.reject(status);
            });
        return defer.promise;
    },

var myApp = angular.module('myApp', ['ngRoute']);

myApp.config( function ($interpolateProvider, $routeProvider) {
    $routeProvider
    ...
    .when('/project/:projectId', {
        templateUrl : 'partials/_project_detail.html',
        controller: 'ProjectDetailCtrl',
        resolve: {
            project: {title: 'foo'}
        }
     });
})

编辑 services.js

var myApp = angular.module('myApp', ['ngRoute']);

myApp.config( function ($interpolateProvider, $routeProvider) {
    $routeProvider
    ...
    .when('/project/:projectId', {
        templateUrl : 'partials/_project_detail.html',
        controller: 'ProjectDetailCtrl',
        resolve: {
            project: function ($route, MyService) {
                return MyService.get('projects/', $route.current.params.projectId).then(function(data) {
                    console.log('VERIFY DATA: ', data);
                    return data;
                });
            }
        }

.controller('ProjectDetailCtrl', function ($scope, project) {
    $scope.project = project;
}

.factory('MyService', function ($http, $q) {

var MyService = {
    ...
    get: function (items_url, objId) {
        var defer = $q.defer();
        $http({method: 'GET', 
            url: api_url + items_url + objId}).
            success(function (data, status, headers, config) {
                defer.resolve(data);
            }).error(function (data, status, headers, config) {
                defer.reject(status);
            });
        return defer.promise;
    },

var myApp = angular.module('myApp', ['ngRoute']);

myApp.config( function ($interpolateProvider, $routeProvider) {
    $routeProvider
    ...
    .when('/project/:projectId', {
        templateUrl : 'partials/_project_detail.html',
        controller: 'ProjectDetailCtrl',
        resolve: {
            project: {title: 'foo'}
        }
     });
})

编辑2 问题显然与服务方法无关，因为这也会产生错误：

app.js

var myApp = angular.module('myApp', ['ngRoute']);

myApp.config( function ($interpolateProvider, $routeProvider) {
    $routeProvider
    ...
    .when('/project/:projectId', {
        templateUrl : 'partials/_project_detail.html',
        controller: 'ProjectDetailCtrl',
        resolve: {
            project: function ($route, MyService) {
                return MyService.get('projects/', $route.current.params.projectId).then(function(data) {
                    console.log('VERIFY DATA: ', data);
                    return data;
                });
            }
        }

.controller('ProjectDetailCtrl', function ($scope, project) {
    $scope.project = project;
}

.factory('MyService', function ($http, $q) {

var MyService = {
    ...
    get: function (items_url, objId) {
        var defer = $q.defer();
        $http({method: 'GET', 
            url: api_url + items_url + objId}).
            success(function (data, status, headers, config) {
                defer.resolve(data);
            }).error(function (data, status, headers, config) {
                defer.reject(status);
            });
        return defer.promise;
    },

var myApp = angular.module('myApp', ['ngRoute']);

myApp.config( function ($interpolateProvider, $routeProvider) {
    $routeProvider
    ...
    .when('/project/:projectId', {
        templateUrl : 'partials/_project_detail.html',
        controller: 'ProjectDetailCtrl',
        resolve: {
            project: {title: 'foo'}
        }
     });
})

我可以验证解析函数是否正确返回，但Angular仍然抱怨

project

未识别。这是什么问题？我已经尝试将我的控制器制作成一个模块，并将其传递给myApp模块，但我仍然收到了

项目
的相同
未识别提供商
问题

注意：我使用的是Angular 1.2.9

编辑3：解决方案
因此，问题在于我的模板中的这一行：

<!-- WRONG: <div ng-controller="ProjectDetailCtrl">-->
<div>

  <h2 ng-show="project">Project: <strong>{{ project.title }}</strong></h2>

</div>


项目：{{Project.title}

显然，
ng controller
指令不能与resolve一起使用。
您将返回MyService.get，这是一个承诺，然后在承诺的结果内，您将返回数据。。。。但是为了什么

你想回报你的承诺，但不是原来的承诺。。。因此，您可以使用
$q
创建自己的承诺，Angular将在加载路线之前为您等待并解决它

project: function ($route, MyService) {
            var deferred = $q.defer();
            MyService.get('projects/', $route.current.params.projectId).then(function(data) {
                console.log('VERIFY DATA: ', data);
                deferred.resolve(data);
            });
            return deferred.promise;
        }

或者，假设MyService.get返回一个承诺，您应该能够这样做

 project: function ($route, MyService) {
            return MyService.get('projects/', $route.current.params.projectId);
        }

显然，将
$q
注入到config
中，您忘记将其作为模块的依赖项添加。这就是$routeProvider和$route服务未定义的原因

更新：

参见示例。问题出现在ng控制器指令中
该问题一直存在，因此可能重复


最上面的答案指出了标记中控制器的使用导致了这种情况
搜索您的代码库（
标记
或
模板
，准确地说）中的术语
ng controller
验证是否有匹配的控制器，如本例中的
ProjectDetailCtrl
将其从标记中删除

它解决了我的问题。
确切的错误是什么<代码>未识别的提供商项目提供商
？
组件$injector中的未知提供商错误
可能是hmmm的重复。我已经从我的服务中返回延迟承诺，尽管我以前应该包含该代码。请看我的编辑。是的，但你是通过做
然后
来处理的，这基本上说明我们已经完成了承诺。请参阅我的第二次编辑。承诺需要回到角度，而不是数据。我明白你的意思，这可能也需要解决。然而，这不是这里的问题。如果我为一个简单对象关闭服务方法，错误仍然存在。@JonathanRowny您不正确
然后
方法返回新承诺。看，哦，是的，我忘记了，然后返回一个新的承诺链。我想这就是它可能起作用的原因。如果这不是他们的问题，我不确定是什么问题。你有没有开迷你们车？如果你包括Angular的非缩微版本，你通常也会得到更好的错误。对不起，我刚刚去掉了那些依赖项，以使问题更精确。在我的代码
ngRoute
中-问题仍然存在。@DarwinTech看到了吗。你们不使用ng控制器指令吗？@DarwinTech用小提琴更新了答案。我不这么认为。我在模板中使用的是
ng controller
指令。@DarwinTech问题是您不能使用此指令，以正确解决问题。