Ui-router模态注入误差在缩小

时间:2014-10-17 11:56:32

标签: angularjs angular-ui-bootstrap angular-ui-router bootstrap-modal

我使用的是ui-router和ui-bootstrap / modal

我的销售屏幕分为2个,所以我的左边有购物车,右边的可以有目录,编辑产品或付款部分。

我需要在所有状态下都有一个模态,所以我创建了一个在某些ui-router状态中添加的函数。 这是功能:

var modalSaleDelete = ['$state', '$modal',
    function($state, $modal) {
      $modal.open({
        templateUrl: 'views/sale/delete.html',
        resolve: {
          parentScope: function($rootScope) {
            return $rootScope.parentScope;
          }
        },
        controller: function($scope, parentScope) {

          $scope.delete = function() {
            // TODO: change the way this is called
            parentScope.resetOrder();

            parentScope = null;
            $scope.$close('cancel');
          };

          $scope.cancel = function() {
            parentScope = null;
            $scope.$dismiss('cancel');
          };
        }
      }).result.then(function() {
        return $state.transitionTo($state.$current.parent);
      }, function() {
        return $state.transitionTo($state.$current.parent);
      });
    }
  ];

然后我把它放在每个州:

    .state('sale.new.catalog.delete', {
      url: '/delete',
      onEnter: modalSaleDelete
    })

它在开发方面效果很好,但是当我缩小它时,我得到一个错误:

Error: [$injector:unpr] Unknown provider: aProvider <- a
http://errors.angularjs.org/1.2.24/$injector/unpr?p0=aProvider%20%3C-%20a
    at http://localhost/ociWeb/code/dist/scripts/vendor.29d508bc.js:3:26944
    at http://localhost/ociWeb/code/dist/scripts/vendor.29d508bc.js:4:11462
    at Object.c [as get] (http://localhost/ociWeb/code/dist/scripts/vendor.29d508bc.js:4:10723)
    at http://localhost/ociWeb/code/dist/scripts/vendor.29d508bc.js:4:11557
    at c (http://localhost/ociWeb/code/dist/scripts/vendor.29d508bc.js:4:10723)
    at Object.d [as invoke] (http://localhost/ociWeb/code/dist/scripts/vendor.29d508bc.js:4:11008)
    at http://localhost/ociWeb/code/dist/scripts/vendor.29d508bc.js:8:20044
    at Object.f [as forEach] (http://localhost/ociWeb/code/dist/scripts/vendor.29d508bc.js:3:27387)
    at j (http://localhost/ociWeb/code/dist/scripts/vendor.29d508bc.js:8:19961)
    at Object.k.open (http://localhost/ociWeb/code/dist/scripts/vendor.29d508bc.js:8:20414) 

我调试了它,aProvider应该是&#39; $ state&#39;。

关于如何做到这一点的任何想法?

3 个答案:

答案 0 :(得分:1)

您需要注释每次注射以使缩小工作。或者,如果您使用的是角度感知的缩小器,它可能无法理解UI-Router注入哪些函数以及哪些是标准函数。

var modalSaleDelete = ['$state', '$modal',
    function($state, $modal) {
      $modal.open({
        templateUrl: 'views/sale/delete.html',
        resolve: {
          parentScope: [ '$rootScope', function($rootScope) {
            return $rootScope.parentScope;
          }]
        },
        controller: [ '$scope', 'parentScope', function($scope, parentScope) {

          $scope.delete = function() {
            // TODO: change the way this is called
            parentScope.resetOrder();

            parentScope = null;
            $scope.$close('cancel');
          };

          $scope.cancel = function() {
            parentScope = null;
            $scope.$dismiss('cancel');
          };
        }]
      }).result.then(function() {
        return $state.transitionTo($state.$current.parent);
      }, function() {
        return $state.transitionTo($state.$current.parent);
      });
    }
  ];

答案 1 :(得分:0)

尝试通过创建inject属性手动注入它们。你有设置jsfiddle或plunker吗?

  modalSaleDelete.$inject = ['$state', '$modal'];

答案 2 :(得分:0)

好吧,我已经弄明白了。我不明白为什么,但问题是解决的。 我解决了注入&#39; $ state&#39;虽然不需要,但仍在解决问题。 调试时我刚看到aProvider试图注入那里。

var modalSaleDelete = ['$rootScope', '$state', '$modal',
    function($rootScope, $state, $modal) {
      $modal.open({
        templateUrl: 'views/sale/delete.html',
        resolve: {
          parentScope: ['$state', '$rootScope', function($state, $rootScope) {
            return $rootScope.parentScope;
          }]
        },
        controller: ['$scope', '$state', 'parentScope', function($scope, $state, parentScope) {

          $scope.delete = function() {
            // TODO: change the way this is called
            parentScope.resetOrder();

            parentScope = null;
            $scope.$close();
          };

          $scope.cancel = function() {
            parentScope = null;
            $scope.$dismiss();
          };
        }]
      }).result.then(function() {
        // close
        return $state.transitionTo($state.current.name.replace('.delete', ''));
      }, function() {
        // dismiss
        return $state.transitionTo($state.current.name.replace('.delete', ''));
      });
    }
  ];