Question

我有AngularJS应用程序（版本1.4.7）和最新版本的ui.bootstrap。当我尝试注入抛出错误Unknown provider: $uibModalInstanceProvider

的$ uibModalInstance时出现问题

这是控制器代码：

/**
 * @constructor
 * @param $uibModal
 */
function ClientsController($uibModal)
{
    var _this = this;

    _this.$uibModal = $uibModal;
}


/**
 *
 */
ClientsController.prototype.create = function()
{
    var instance = this.$uibModal.open(
        {
            animation: true,
            templateUrl: 'modules/clients/views/modal/client.html',
            controller: 'ClientModalInstController as ctrl',
            size: 'lg'
        }
    );
};

这是模态控制器

ClientModalInstController.$inject = [
    '$uibModalInstance'
];


/**
 * @constructor
 * @param $uibModalInstance
 */
function ClientModalInstController($uibModalInstance)
{
    var _this = this;

    _this.$uibModalInstance = $uibModalInstance;
}

知道什么可能导致这种行为吗？

Answer 1

可能导致此行为的原因如下：

$uibModal.open()返回$modalInstance，需要将$uibModalInstance依赖注入ClientModalInstController控制器。我看不到ClientModalInstController的代码，但需要注入$uibModalInstance，这与$uibModal不同

您可以在ui-bootstrap文档中的模态示例的javascript标签中看到此示例：http://angular-ui.github.io/bootstrap/

向下滚动到文档的Modal部分，查看Javascript选项卡中ModalInstanceCtrl及其注入的依赖项的代码。

Answer 2

@SilvioMarijic如果物品没有注入正确的订单，这会中断。确保一切都排好。

代码示例：

angular.module('App').controller('YourController', ['$scope', '$http', '$uibModal', 
function ($scope, $http, $uibModal) {

  //CODE HERE

}]);

假设您在构造函数（任一行）中交换了$ http和$ uiModal，您将得到您描述的错误。

AngularJS ui-bootstrap模态实例问题

2 个答案: