无法在打字稿中运行 uibmodal

Question

我正在尝试使用 $uibModal 使用 typescript 和 angular 来显示模式。

    export class PDPController{

    static $inject = ['pdpService', '$sce', 'angularLoad', '$uibModalInstance'];
    constructor(
        pdpService: PDPService, 
        $sce : ng.ISCEService, 
        angularLoad,
        //initiating in constructor
        private $uibModalInstance:ng.ui.bootstrap.IModalServiceInstance
    ) {
        this.pdpService=pdpService;
        //Need to add promise
        pdpService.getContentdata(APP_CONSTANT.API_URL_LEARN_MORE)
            .then((authorContentData) => {
            this.contentData= authorContentData;
            pdpService.getPDPdata(APP_CONSTANT.API_URL_LEARN_MORE)
            .then((pdpData) => {
            console.log(pdpData);
            this.setProductDetails(pdpData);
        });
        });

    }
    //method to invoke the modal
    private showPromo(): void{

        console.log("Promo");
          var modalInstance = this.$uibModal.open({
              animation: "true",
              templateUrl: 'promoModalContent.html',
              appendTo: 'body'
            });
    }
}

//module:
let module: ng.IModule = angular.module(pdpModule, ['ui.bootstrap']);

我在运行 Gulp Build 时遇到了这个错误：

Unknown provider: $uibModalInstanceProvider <- $uibModalInstance
Module 'angular.ui' has no exported member 'bootstrap'.

$uibModal 在我运行代码时无法识别： 错误：“PDPController”类型上不存在属性“$uibModal”。

我对 Typescript 完全陌生，无法找到出路。 请指导。

Answer 1

你没有注入$uibModal。尝试将其添加到您的$inject：

static $inject = ['pdpService', '$sce', 'angularLoad', '$uibModalInstance', '$uibModal'];

Answer 2

我可以解决这个问题...但真的不知道这是如何工作的！ 我所做的编辑：

export class PDPController {
    public $uibModal: ng.ui.bootstrap.IModalService;
    public modal: any;

    //injected $uibModal
    static $inject = ['pdpService', '$sce', 'angularLoad', '$uibModal'];
    //initiated $uibModal
    constructor(
        pdpService: PDPService,
        $sce: ng.ISCEService,
        angularLoad,
        $uibModal: ng.ui.bootstrap.IModalService
    ) {
        // i had to assign the value of $uibModal to a new variable, otherwise
        //$uibModal is undefined when accessed in the function showPromo().
        this.modal = $uibModal;
    }

    private showPromo(): void {

        let modalInstance = this.modal.open({
            animation: "true",
            templateUrl: 'promoModalContent.html'
        });
    }
}

如果有人能解释为什么我们需要一个新变量，那就太好了！