我正在尝试在Angular2项目中使用SwaggerUI和TypeScript。SwaggerUI没有TypeScript定义,所以我尝试使用JavaScript文件。
此项目是使用ASP.NET核心SPA服务模板创建的。我已经将所有SwaggerUI文件从“dist”文件夹添加到我的项目中的“wwwroot”文件夹。
我在_Layout.cshtml(查看页面)中从我的项目的“wwwroot”文件夹中引用了SwaggerUI的JavaScript文件,就像普通的JavaScript文件一样,并试图使用ShaggerUIBundle对象。
_布局.cshtml
<script src="/swagger-ui/swagger-ui-bundle.js"> </script>
<script src="/swagger-ui/swagger-ui-standalone-preset.js"> </script>
Swagger.Component.ts
//my import statements
export class SwaggerComponent implements OnInit {
SwaggerUIBundle:any;
}
现在SwaggerUIBundle填充了我所期望的对象。但是我不能在组件的任何地方使用它。
ngOnInit(): void {
(<any>window).ui = this.SwaggerUIBundle({
url: "<url>",
dom_id: '#swagger-ui',
presets: [
this.SwaggerUIBundle.presets.apis
],
plugins: [
this.SwaggerUIBundle.plugins.DownloadUrl
],
layout: "StandaloneLayout"
})
}
this.SwaggerUIBundle始终为null。
我认为这是因为实际上没有为SwaggerUIBundle分配任何值,尽管它已经填充了一个对象。
SwaggerUIBundle是一个函数。我尝试了多种方法来分配这个函数,如建议的here和here。
我尝试导入而不是引用文件。
import SwaggerUIBundle from 'path from root of the app'
由于“wwwroot”文件夹是一个虚拟文件夹,代表应用程序的根文件夹,当我尝试使用“import”导入时,TypeScript编译器会抛出一个错误,即它找不到文件。
然后,我将所有SwaggerUI相关文件移动到相应的angular组件文件夹,并尝试从那里导入。然后我得到这个错误。
'allowJs未设置。
我已经在tsconfig中添加了'allowJs'。错误仍然不会消失。
"compilerOptions": {
"moduleResolution": "node",
"target": "es5",
"sourceMap": true,
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"skipDefaultLibCheck": true,
"lib": [ "es6", "dom" ],
"types": [ "node" ],
"allowJs": true
}
任何帮助都很感激。
2条答案
按热度按时间deikduxw1#
尝试以下方法来包含javascript文件
component.ts
oug3syen2#
this
引用的是封闭类的示例,而不是定义该类的模块的词法环境。而不是使用
this
导入并直接引用SwaggerUIBundle
,如此外,您可能希望在
ngOnInit
(每个组件生命周期的事件)中初始化它一次,而不是在ngOnInit
中初始化它这种逻辑应该被提取到一个专门的函数或服务中,以保持视图的整洁。