使用 Angular.js 获取 [$injector:unpr] 错误答案

【问题标题】：Getting [$injector:unpr] error using Angular.js使用 Angular.js 获取 [$injector:unpr] 错误
【发布时间】：2016-08-31 10:48:41
【问题描述】：

使用 Angular.js 点击链接时出现以下错误。

错误：

VM1186 angularjs.js:107 Error: [$injector:unpr] http://errors.angularjs.org/1.4.6/$injector/unpr?p0=UploadProvider%20%3C-%20Upload%20%3C-%20adminCatCategoryController
    at Error (native)
    at https://run.plnkr.co/8hsX4IhGSoTXwnkj/angularjs.js:6:416
    at https://run.plnkr.co/8hsX4IhGSoTXwnkj/angularjs.js:40:409
    at Object.d [as get] (https://run.plnkr.co/8hsX4IhGSoTXwnkj/angularjs.js:38:394)
    at https://run.plnkr.co/8hsX4IhGSoTXwnkj/angularjs.js:40:483
    at d (https://run.plnkr.co/8hsX4IhGSoTXwnkj/angularjs.js:38:394)
    at e (https://run.plnkr.co/8hsX4IhGSoTXwnkj/angularjs.js:39:161)
    at Object.instantiate (https://run.plnkr.co/8hsX4IhGSoTXwnkj/angularjs.js:39:310)

我的代码如下。

index.html:

<html ng-app="Spesh">

  <head>
    <link data-require="bootstrap@*" data-semver="4.0.0-alpha.2" rel="stylesheet" href="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/css/bootstrap.css" />
    <script data-require="bootstrap@*" data-semver="4.0.0-alpha.2" src="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/js/bootstrap.js"></script>
    <script data-require="jquery@*" data-semver="3.0.0" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.js"></script>
    <script src="angularjs.js" type="text/javascript"></script>
    <script src="angularuirouter.js" type="text/javascript"></script>
    <script src="angularuibootstrap.js" type="text/javascript"></script>
    <script src="loginRoute.js" type="text/javascript"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body>
    <h1>Test tab</h1>
    <div ui-view></div>
     <script src="adminController.js" type="text/javascript"></script>
     <script src="adminCategoryController.js" type="text/javascript"></script>
    <script src="adminCatCategoryController.js" type="text/javascript"></script>
    <script src="adminSubcatCategoryController.js" type="text/javascript"></script>
  </body>

</html>

loginRoute.js：

var Admin = angular.module('Spesh', ['ui.router','ui.bootstrap']);
Admin.run(function($rootScope, $state) {
  $rootScope.$state = $state;
});
Admin.config(function($stateProvider, $urlRouterProvider, $locationProvider) {
  $urlRouterProvider.otherwise('/');
  $stateProvider
    .state('/', {
      url: '/',
      templateUrl: 'dashboard.html',
      controller: 'adminController'
    })
    .state('category', { /* This state defines the department management page */
        url: '/category',
        templateUrl: 'category.html',
        controller: 'adminCategoryController'
        })

        .state('category.cat', { /* This state defines the department management page */
        url: '/manage_category',
        templateUrl: 'manage_category.html',
        controller: 'adminCatCategoryController'
        })

        .state('category.subcat', { /* This state defines the department management page */
        url: '/manage_subcategory',
        templateUrl: 'manage_subcategory.html',
        controller: 'adminSubcatCategoryController'
        })
})

dashboard.html：

<nav>
  <ul>
     <li ng-class="{'active open': $state.includes('category')}"><a ui-sref="category.cat">Category</a></li>
  </ul>
</nav>

<div class="row" style="padding-top:120px;" ui-view>

</div>

当我点击Category 链接时，出现上述错误。我的Plunkr code is here。我该如何解决这个错误？

【问题讨论】：

请提供您的 jsfiddle。
adminCatCategoryController 在哪里？
UploadProvider 搞砸了
请查看我更新的帖子。
@Loading.. : 请再次查看我的帖子。

标签： javascript angularjs angular-ui-router

【解决方案1】：

在您的 plunker 中，链接“category/manage_category”将使用“adminCatCategoryController”控制器。它有一些代码：

dashboard.controller('adminCatCategoryController',function($scope,$http,$location,$window,$state,Upload,focusInputField){
})

我找不到任何将“Upload”、“focusInputField”定义为 service/factory 或 constant 的文件。所以当你在这里注入它们时，angular 无法检测到它们并抛出错误。

删除或定义它们将解决您的问题。

希望对你有帮助！谢谢！

【讨论】：

感谢您检测到这种类型的错误。它现在可以工作了。