Angular

Angular

Use generated client code in your Angular app

Note: The generated client code is compatible with Angular 9.0.0+. Please make sure to upgrade your project if you're still using an older version of Angular.

  • Extract the downloaded archive to <angular_project_folder>/gen/typescript-angular-client
  • In your app.modules.ts add the following:

{% c-block language="typescript" %}
import { ApiModule } from 'gen/typescript-angular-client';
...
@NgModule({
 imports: [
    ...
   ApiModule,
   HttpClientModule
 ],
  ...
})
{% c-block-end %}

  • In your app.component.ts you can now use the generated services and models like this:

{% c-block language="typescript" %}
import { NoteService, Note } from 'gen/typescript-angular-client';

export class AppComponent {
  notes$: Observable<Note[]>

 constructor(private noteService: NoteService) {
 }

 ngOnInit() {
   this.notes$ = this.noteService.listNotes()
 }

  ...
}
{% c-block-end %}

That's it! 🎉

A complete example for using generated client code in an Angular app including authentication is available here: https://github.com/stackprint/example-notes-angular