Search code examples
angularrestapiswaggerbase-path

What role does BASE_PATH play in Angular projects?


In order to integrate the "Angular-Typescript-Client-Generated" files generated by Angular in my Angular project, I have to provide the path of the Api (http://localhost:8080). The README file generated by Swagger says:

Set service base path

If different than the generated base path, during app bootstrap, you can provide the base path to your service.

import { BASE_PATH } from '';

bootstrap(AppComponent, [
    { provide: BASE_PATH, useValue: 'https://your-web-service.com' },
]);

or

import { BASE_PATH } from '';

@NgModule({
    imports: [],
    declarations: [ AppComponent ],
    providers: [ provide: BASE_PATH, useValue: 'https://your-web-service.com' ],
    bootstrap: [ AppComponent ]
})
export class AppModule {}
Using @angular/cli

First extend your src/environments/*.ts files by adding the corresponding base path:

export const environment = {
  production: false,
  API_BASE_PATH: 'http://127.0.0.1:8080'
};

In the src/app/app.module.ts:

import { BASE_PATH } from '';
import { environment } from '../environments/environment';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [ ],
  providers: [{ provide: BASE_PATH, useValue: environment.API_BASE_PATH }],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

I tried to execute the second method "Using @angular/cli" but unfortunately I can't use

import { BASE_PATH } from '';

because the error

Cannot find module''

occurs. I don't really understand who provides the BASE_PATH in the ANgular project.

Could you help me please with some ideas how to set the base path or with some explanation about the process of providing the base_path?

Thank you!


Solution

  • Check documentation here. BASE_PATH is supposed to be declared in one of the files

    import { BASE_PATH } from '@swagger/angular2-typescript-petstore';
    
    bootstrap(AppComponent, [
        { provide: BASE_PATH, useValue: 'https://your-web-service.com' },
    ]);