angular - 无法将 InjectionToken 注入服务构造函数

Question

我需要解决，为什么我的 injectionToken 没有被注入到类构造函数中。我有角度（7.1），从 NSwag 生成的代码。

我已经尝试将提供程序代码放在模块和组件中。谢谢你的建议。

客户端.ts

export const API_BASE_URL = new InjectionToken<string>('API_BASE_URL');

export class Client implements IClient {
private http: HttpClient;
private baseUrl: string;
protected jsonParseReviver: ((key: string, value: any) => any) | undefined = undefined;
// Removed @Optional for debug purpose
constructor(@Inject(HttpClient) http: HttpClient, @Inject(API_BASE_URL) baseUrl?: string) {
    this.http = http;
    this.baseUrl = baseUrl ? baseUrl : "";
}
}

app.module.ts

const API_BASE_URL = new InjectionToken<string>('API_BASE_URL');

// providers array
providers: [
    {provide: API_BASE_URL, useValue: 'localhost:1234'},
    Client,
    ArticleService
]

文章.service.ts

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

  client: Client;

  constructor(client: Client) {
    this.client = client;
  }
}


ERROR Error: Uncaught (in promise): Error: StaticInjectorError(AppModule) 
[Client -> InjectionToken API_BASE_URL]: 
  StaticInjectorError(Platform: core)[Client -> InjectionToken API_BASE_URL]: 
   NullInjectorError: No provider for InjectionToken API_BASE_URL!
Error: StaticInjectorError(AppModule)[Client -> InjectionToken API_BASE_URL]: 
  StaticInjectorError(Platform: core)[Client -> InjectionToken API_BASE_URL]: 
    NullInjectorError: No provider for InjectionToken API_BASE_URL!

标签： angulartypescriptswaggerswagger-codegen

Answer 1

在您的environment.ts文件中，您应该添加API_BASE_URL如下条目：

export const environment = {
  production: false,
  API_BASE_URL: "https://localhost:44336"
};

同样，在您environment.prod.ts为您的生产添加一个条目API_BASE_URL。

接下来在您的main.ts文件中导入您的API_BASE_URL声明client.ts并将其添加API_BASE_URL到提供程序中，以便您main.ts看起来类似于以下内容：

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { environment } from './environments/environment';
import { AppModule } from "./app/app.module";
import { API_BASE_URL } from "./app/client.ts";

console.log(environment);

if (environment.production) {
  enableProdMode();
}

export function getBaseUrl() {
  return document.getElementsByTagName('base')[0].href;
}

const providers = [
  { provide: API_BASE_URL, useValue: environment.API_BASE_URL },
  { provide: 'BASE_URL', useFactory: getBaseUrl, deps: [] }
];

platformBrowserDynamic(providers).bootstrapModule(AppModule)
  .catch(err => console.error(err));