【问题标题】:Services generated by openapi-generator-cli not injectableopenapi-generator-cli 生成的服务不可注入
【发布时间】:2019-12-07 12:48:10
【问题描述】:

我正在尝试使用 openapi-generator-cli 从 v2 swagger 文件生成 API 客户端。为此,我使用了 openapi-generator-cli 的 docker 容器,它将其版本报告为“4.1.0-SNAPSHOT”。

代码生成使用以下选项:

{
    "npmName": "...",
    "npmVersion": "0.0.3",
    "snapshot": true,
    "ngVersion": "8.1.1"
}

我还尝试将 providedInRoot 选项设置为 true。

但是,生成的服务类没有使用 @Injectable 装饰器进行注释。所以在我的组件中导入它们并在组件的构造函数中添加服务后,我无法使用它们。这就是我的组件的样子:

import { Component, OnInit } from '@angular/core';

import { UsersService, User } from '...'

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  constructor(userService: UsersService) {}

  title = 'user-frontend';

  ngOnInit() {
    this.userService.listUsers();
  }

}

失败,因为appComponent范围内不存在userService。

这是我导入生成模块的方式:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';

import { ApiModule } from '...';
import { HttpClientModule } from '@angular/common/http';


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    ApiModule,
    HttpClientModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

关于生成 api 客户端时我的错误在哪里有什么想法吗?

编辑: 生成的代码如下所示:

@Injectable({
  providedIn: 'root'
})
export class UsersService {

    protected basePath = 'http://localhost';
    public defaultHeaders = new HttpHeaders();
    public configuration = new Configuration();
    public encoder: HttpParameterCodec;

    constructor(protected httpClient: HttpClient, @Optional()@Inject(BASE_PATH) basePath: string, @Optional() configuration: Configuration) {

        if (configuration) {
            this.configuration = configuration;
            this.configuration.basePath = configuration.basePath || basePath || this.basePath;

        } else {
            this.configuration.basePath = basePath || this.basePath;
        }
        this.encoder = this.configuration.encoder || new CustomHttpParameterCodec();
    }

...
}

【问题讨论】:

  • 您是否尝试将ApiModule 放入 providers 数组中?
  • @AugustinR,我刚试过,但没有帮助

标签: angular openapi-generator


【解决方案1】:

很多问题 import { ApiModule } from '...';生成的代码来自哪里? 您将其发布到 npm 并使用它还是只是复制粘贴生成的代码? 试试这个

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    ApiModule.forRoot(() => {
      return new Configuration({
        basePath: `${environment.HOST}:${environment.PORT}`,
      });
    }),,
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

你生成的代码应该是这样的

@Injectable({
  providedIn: 'root'
})
export class PetsService {

    protected basePath = 'http://localhost';
    public defaultHeaders = new HttpHeaders();
    public configuration = new Configuration();

    constructor(protected httpClient: HttpClient, @Optional()@Inject(BASE_PATH) basePath: string, @Optional() configuration: Configuration) {

        if (configuration) {
            this.configuration = configuration;
            this.configuration.basePath = configuration.basePath || basePath || this.basePath;

        } else {
            this.configuration.basePath = basePath || this.basePath;
        }
    }

解决方案:在构造函数中使用 private 或 public

说明: 这里我们有和你一样的问题 typescript dont know what you want

class TestClass {
  constructor(name: string) {
  }
}

这里我们有一个普通的 POO promamming 语言的例子

class TestClass {
  private name: string;

  constructor(name: string) {
    this.name = name;
  }
}

但是 typescript 给了我们一个简单的方法来最小化代码

class TestClass {
  constructor(private name: string) { }
}

【讨论】:

  • 感谢您的提示,不幸的是我仍然遇到同样的错误。为了回答您的问题,我将生成的代码发布到私有 npm 并从那里使用它。由于我可以导入 ApiModule、类等,因此我很有信心这部分可以正常工作。您能否暗示为什么将 ApiModule 引入我的项目的不同方式会导致这样的错误?
  • 您生成代码并使用 ng-packagr 将其转换为角度库?
  • 没错,我生成代码,切换到生成代码所在的文件夹,然后我运行:npm install,nextnpm run build(执行ng-packagr),然后我登录到我的 npm 注册表并对我的注册表执行 npm publish dist
  • 我得到了同样的结果,所以似乎是一个模板问题检查我上面的编辑并告诉我你是否生成了类似的代码
  • 感谢您的帮助,我编辑了我的问题并附加了导出的 UsersService 类。对我来说看起来一样。
猜你喜欢
  • 2022-06-27
  • 2021-11-15
  • 2022-07-23
  • 2020-05-06
  • 1970-01-01
  • 2021-08-15
  • 1970-01-01
  • 1970-01-01
  • 2022-12-29
相关资源
最近更新 更多