AngularJS 注入错误 - 未知提供者：modalMessagesProvider <- modalMessages答案

【问题标题】：AngularJS injection Error - Unknown provider: modalMessagesProvider <- modalMessagesAngularJS 注入错误 - 未知提供者：modalMessagesProvider <- modalMessages
【发布时间】：2019-01-17 08:47:12
【问题描述】：

我有一个服务打开一个带有组件控制器的 angular-ui-bootstrap 模式。但是我的控制器无法访问我传递的参数（modalMessages，我只想打印它）。错误是：错误：[$injector:unpr] 未知提供者：modalMessagesProvider

谁能帮忙？

服务：

angular.module('app').service('AlertService', function ($uibModal) {
    this.showModal = function (modalMessages) {
        return $uibModal.open({
            component: "modalComponent",
            resolve: {
                modalMessages: function () {
                    return modalMessages;
                }
            }
        }).result;
    }
});

组件控制器：

'use strict';

const Modal = {
    templateUrl: 'views/modals/modalAlert.html',
    controller: ['modalMessages', ModalCtrl],
    controllerAs: '$ctrl',
    bindings: {
        modalMessages: "<",
    }
}


angular.module('app').component('modalComponent', Modal);

function ModalCtrl() {

    this.modalMessages = modalMessages;
    console.log(this.modalMessages);
}

【问题讨论】：

你在AlertService中使用的服务modalMessages在哪里？
服务调用如下：AlertService.showModal({ header: 'header', information: 'info' });
我尝试将modalMessages注入控制器，所以它必须是function ModalCtrl(modalMessages)
你能检查一下你是否定义了.service('modalMessages',anywhere 吗？
我没有，因为它不应该是服务，应该是服务给组件的参数

标签： angularjs dependency-injection angular-ui-bootstrap

【解决方案1】：

看看这个plunkr

注意我所做的更改：

(function(){
  const Modal = {
    templateUrl: 'modalAlert.html',
    controller:  ModalCtrl,
    bindings: {
      resolve: "<"
    }
};

angular.module('app').component('modalComponent', Modal);

function ModalCtrl() {
  var $ctrl = this;
  $ctrl.$onInit = function() {
    $ctrl.modalMessages = $ctrl.resolve.modalMessages;
  }
}

})()

您需要使用resolve 和bindings 来访问传递的参数

【讨论】：

我做了，但是：“感谢您的反馈！声望低于 15 人的投票会被记录下来，但不要更改公开显示的帖子得分。”
@Isabel 啊哈.. 真的