import/inject TypeScript 中的模块+AngularJS 正确的方式

Question

我已经通过 npm https://github.com/skeymeulen/swangular 下载了这个模块，并希望将它与 TypeScript 一起使用。现在我正在努力以正确的方式包括依赖项。就像 GitHub 上的 READ.me 告诉我我正在像这样在我的应用程序中注入模块：

var app = angular.module("app", ['ui.bootstrap', 'swangular']);

我的控制器看起来像这样：

class SimpleController {
    static readonly $inject = ["$scope", "$http", "$uibModal", "swangular", ProjectsService.serviceName, AttributesService.serviceName];

        constructor(
            private $scope: ng.IScope,
            private $http: ng.IHttpService,
            private $uibModal: ng.ui.bootstrap.IModalService,
            private projectsSvc: IProjectsService,
            private attributesSvc: IAttributesService,
            private swangular: any) { }

...
}

因为我没有 @types for swangular，所以我只使用 any 作为类型。

接下来我试着这样称呼它：

this.swangular.swal('Swangular Demo', 'Great demo, right?', 'question');

我收到以下错误：

TypeError: this.swangular.swal 不是函数

我已经包含了以下必要的 js 文件：

<script type="text/javascript" src="../node_modules/sweetalert2/dist/sweetalert2.js"></script>
<script type="text/javascript" src="../node_modules/swangular/swangular.js"></script>

我也不明白这和在 js 文件开头导入依赖项之间的区别，例如 import * as angular from 'angular';。可能是我用错了？

感谢任何帮助。

Answer 1

$inject 注释和构造函数参数不匹配。

static readonly $inject = ["$scope", "$http", "$uibModal", "swangular", ProjectsService.serviceName, AttributesService.serviceName];

    constructor(
        private $scope: ng.IScope,
        private $http: ng.IHttpService,
        private $uibModal: ng.ui.bootstrap.IModalService,
        private projectsSvc: IProjectsService,
        private attributesSvc: IAttributesService,
        private swangular: any) { }

它们应该以相同的顺序出现，但它们不是。 Angular 无法找出第 4 个 $inject 元素 ("swangular") 匹配第 6 个构造函数参数 (private swangular: any).

import/inject TypeScript 中的模块+AngularJS 正确的方式

import/inject modules in TypeScript+AngularJS the right way

javascript

angularjs

typescript

sweetalert