Question

我似乎遇到了Angular UI路由器的问题，并尝试将解析添加到状态。奇怪的是，我把它放在另一个地方并且工作正常。

我将代码分成不同的组件区域，我的代码结构如下：

/app
  /component-dashboard
    index.js
    /controllers
      DashboardCtrl.js
  /component-chart-1
    index.js
    /controllers
      Chart1Ctrl.js

例如，我有根仪表板，这很好用：

// index.js

angular.module('az-ci')
.config([
  '$stateProvider',
  function($stateProvider) {

    $stateProvider
      .state('dashboard', {
        templateUrl: '/app/ci-dashboard/templates/dashboard.html',
        url: '/',
        controller: 'DashboardCtrl',
        resolve: {
          chartList: function() {
            return [{
              name: 'Chart 1',
              state: 'dashboard.chart1'
            }];
          }
        }
      });
  }
]);

// Dashboard Ctrl
angular.module('az-ci')
.controller('DashboardCtrl', [
  '$scope',
  '$rootScope',
  'chartList',
  function($scope, $rootScope, chartList) {

    $scope.chartList = chartList;

  }
]);

但是在图表组件中，我使用此（简化）代码得到以下错误：

// Error
Error: [$injector:unpr] Unknown provider: productListProvider <- productList

// index.js
angular.module('az-ci')
.config([
  '$stateProvider',
  function($stateProvider) {

    $stateProvider
      .state('dashboard.chart1', {
        templateUrl: '/app/ci-chart-1/templates/chart.html',
        url: '/chart/chart1',
        controller: 'Chart1Ctrl',
        resolve: {
          productList: ['csv', '$stateParams', function(csv, $stateParams) {
            return {};
          }]
        }
      });
  }
]);

// Chart1Ctrl
angular.module('az-ci')
.controller('Chart1Ctrl', [
  '$scope',
  '$rootScope',
  '$state',
  'productList',
  function($scope, $rootScope, $state, productList) {

    $scope.products = productList;

  }
]);

Answer 1

问题是我已将控制器定义为也用于我创建的指令以显示D3图表。从中删除已定义的控制器将其修复。

Angular UI Router解决抛出提供程序错误

1 个答案: