- Added angular documentation

Author: ferdikoomen

docs/angular-support.md

@@ -1,13 +1,84 @@
 # Angular support
 
-Lorem
+This tool allows you to generate a client based on the [`Angular HttpClient`](https://angular.io/guide/http).
+The generated services are fully injectable and make use of the [RxJS](https://rxjs.dev/) Observer pattern.
+If you want to generate the Angular based client then you can specify `--client angular` in the openapi call:
 
 `openapi --input ./spec.json --output ./generated --client angular`
 
-This has been tested with the following versions:
+The Angular client has been tested with the following versions:
 
 ```
 "@angular/common": "13.1.3",
 "@angular/core": "13.1.3",
 "rxjs": "7.5.2",
 ```
+
+## Example
+
+In the AppModule you can import the services and add them to the list of injectable services:
+
+```typescript
+import { HttpClientModule } from '@angular/common/http';
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+
+import { OrganizationService } from './generated/services/OrganizationService';
+
+@NgModule({
+    imports: [
+        BrowserModule,
+        HttpClientModule,
+    ],
+    providers: [
+        OrganizationService,
+    ],
+    bootstrap: [
+        AppComponent,
+    ],
+})
+export class AppModule {}
+
+platformBrowserDynamic()
+    .bootstrapModule(AppModule)
+    .catch(err => console.error(err));
+```
+
+Inside the component you can inject the service and just use it as you would with any observable:
+
+```typescript
+import { Component } from '@angular/core';
+
+import type { OrganizationService } from './generated/services/OrganizationService';
+
+@Component({
+    selector: 'app-root',
+    template: `<div>Angular is ready</div>`,
+})
+export class AppComponent {
+    constructor(private readonly organizationService: OrganizationService) {
+
+        // Make a call
+        this.organizationService
+            .createOrganization({
+                name: 'OrgName',
+                description: 'OrgDescription',
+            })
+            .subscribe(organization => {
+                console.log(organization);
+            });
+
+        // Or even map result and retry on error
+        this.organizationService
+            .getOrganizations()
+            .pipe(
+                map(organizations => organizations[0]),
+                retryWhen(error => error)
+            )
+            .subscribe(organization => {
+                console.log(organization);
+            });
+    }
+}
+```

test/index.js

@@ -7,7 +7,7 @@ const generate = async (input, output) => {
     await OpenAPI.generate({
         input,
         output,
-        httpClient: OpenAPI.HttpClient.ANGULAR,
+        httpClient: OpenAPI.HttpClient.FETCH,
         useOptions: false,
         useUnionTypes: false,
         exportCore: true,
@@ -57,8 +57,8 @@ const generateRealWorldSpecs = async () => {
 };
 
 const main = async () => {
-    await generate('./test/spec/aap.json', './test/generated/aap/');
-    // await generate('./test/spec/v3.json', './test/generated/v3/');
+    await generate('./test/spec/v2.json', './test/generated/v2/');
+    await generate('./test/spec/v3.json', './test/generated/v3/');
     // await generateRealWorldSpecs();
 };