3

我在 Angular 8 应用程序中使用 JavaScript 库 OpenSeadragon。所以常用的方法是在 angular.jsonscripts部分注册 javascript.min.js 文件，并在 TypeScript 中使用如下方式：

declare var OpenSeadragon: any;

然后我可以在我的 TypeScript 组件中使用 OpenSeadragon，如下所示：

const test: any = OpenSeadragon({});

所以，这是有效的。

对于这个库，有几个插件/扩展。我需要使用其中一些插件。它们依赖于导入主/核心库。所以我也在 angular.jsonscripts部分添加了插件的 js 文件。

"scripts": [
  "./node_modules/openseadragon/build/openseadragon/openseadragon.min.js",       
  "./node_modules/openseadragonselection/dist/openseadragonselection.js"
]

这些插件的结构是它们通过以下方式扩展核心功能：

    $.Viewer.prototype.selection = function(options) {
        if (!this.selectionInstance || options) {
            options = options || {};
            options.viewer = this;
            this.selectionInstance = new $.Selection(options);
        }
        return this.selectionInstance;
    };

对于来自 main-lib 的Viewer对象/实例，他们引入了一种名为selection({withOptions})的新方法

问题是如何在我的 Angular TypeScript 组件中访问新方法？目前我收到方法选择不存在的错误。

4

2 回答 2

0

从路径中删除 ./

路径应该是这样的

“node_modules/openseadragon/build/openseadragon/openseadragon.min.js”，“node_modules/openseadragon-annotations/dist/openseadragon-annotations.js”，

于 2019-11-22T06:09:58.423 回答
0

您可以尝试更改any声明中的值并添加特定类型，也可以添加如下内容：

declare global {
  interface OpenSeadragon {
    selection: (options:any) => any;
  }
}
于 2019-09-12T12:03:25.150 回答