Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support Angular 13 #10877

Merged
merged 1 commit into from
Dec 3, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 11 additions & 0 deletions bin/configs/typescript-angular-v13-provided-in-root-with-npm.yaml
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
generatorName: typescript-angular
outputDir: samples/client/petstore/typescript-angular-v13-provided-in-root/builds/with-npm
inputSpec: modules/openapi-generator/src/test/resources/2_0/petstore.yaml
templateDir: modules/openapi-generator/src/main/resources/typescript-angular
additionalProperties:
ngVersion: 13.0.1
npmVersion: 1.0.0
npmName: '@openapitools/typescript-angular-petstore'
npmRepository: https://skimdb.npmjs.com/registry
snapshot: false
supportsES6: true
7 changes: 7 additions & 0 deletions bin/configs/typescript-angular-v13-provided-in-root.yaml
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
generatorName: typescript-angular
outputDir: samples/client/petstore/typescript-angular-v13-provided-in-root/builds/default
inputSpec: modules/openapi-generator/src/test/resources/2_0/petstore.yaml
templateDir: modules/openapi-generator/src/main/resources/typescript-angular
additionalProperties:
ngVersion: 13.0.1
supportsES6: true
2 changes: 1 addition & 1 deletion docs/generators/typescript-angular.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ These options may be applied as additional-properties (cli) or configOptions (pl
|modelFileSuffix|The suffix of the file of the generated model (model<suffix>.ts).| |null|
|modelPropertyNaming|Naming convention for the property: 'camelCase', 'PascalCase', 'snake_case' and 'original', which keeps the original name. Only change it if you provide your own run-time code for (de-)serialization of models| |original|
|modelSuffix|The suffix of the generated model.| |null|
|ngVersion|The version of Angular. (At least 6.0.0)| |12.2.12|
|ngVersion|The version of Angular. (At least 6.0.0)| |13.0.1|
|npmName|The name under which you want to publish generated npm package. Required to generate a full package| |null|
|npmRepository|Use this property to set an url your private npmRepo in the package.json| |null|
|npmVersion|The version of your npm package. If not provided, using the version from the OpenAPI specification file.| |1.0.0|
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ public static enum PROVIDED_IN_LEVEL {none, root, any, platform}
public static final String STRING_ENUMS_DESC = "Generate string enums instead of objects for enum values.";
public static final String QUERY_PARAM_OBJECT_FORMAT = "queryParamObjectFormat";

protected String ngVersion = "12.2.12";
protected String ngVersion = "13.0.1";
protected String npmRepository = null;
private boolean useSingleRequestParameter = false;
protected String serviceSuffix = "Service";
Expand Down Expand Up @@ -146,7 +146,7 @@ public String getName() {

@Override
public String getHelp() {
return "Generates a TypeScript Angular (6.x - 12.x) client library.";
return "Generates a TypeScript Angular (6.x - 13.x) client library.";
}

@Override
Expand Down Expand Up @@ -243,7 +243,7 @@ public void processOpts() {
} else {
additionalProperties.put(DELETE_ACCEPTS_BODY, false);
}

additionalProperties.put(NG_VERSION, ngVersion);

if (additionalProperties.containsKey(API_MODULE_PREFIX)) {
Expand Down Expand Up @@ -300,7 +300,9 @@ private void addNpmPackageGeneration(SemVer ngVersion) {
}

// Set the typescript version compatible to the Angular version
if (ngVersion.atLeast("12.0.0")) {
if (ngVersion.atLeast("13.0.0")) {
additionalProperties.put("tsVersion", ">=4.4.2 <4.5.0");
} else if (ngVersion.atLeast("12.0.0")) {
additionalProperties.put("tsVersion", ">=4.3.0 <4.4.0");
} else if (ngVersion.atLeast("11.0.0")) {
additionalProperties.put("tsVersion", ">=4.0.0 <4.1.0");
Expand All @@ -318,7 +320,9 @@ private void addNpmPackageGeneration(SemVer ngVersion) {
}

// Set the rxJS version compatible to the Angular version
if (ngVersion.atLeast("10.0.0")) {
if (ngVersion.atLeast("13.0.0")) {
additionalProperties.put("rxjsVersion", "7.4.0");
} else if (ngVersion.atLeast("10.0.0")) {
additionalProperties.put("rxjsVersion", "6.6.0");
} else if (ngVersion.atLeast("9.0.0")) {
additionalProperties.put("rxjsVersion", "6.5.3");
Expand All @@ -334,7 +338,10 @@ private void addNpmPackageGeneration(SemVer ngVersion) {
supportingFiles.add(new SupportingFile("ng-package.mustache", getIndexDirectory(), "ng-package.json"));

// Specific ng-packagr configuration
if (ngVersion.atLeast("12.0.0")) {
if (ngVersion.atLeast("13.0.0")) {
additionalProperties.put("ngPackagrVersion", "13.0.3");
additionalProperties.put("tsickleVersion", "0.43.0");
} else if (ngVersion.atLeast("12.0.0")) {
additionalProperties.put("ngPackagrVersion", "12.2.1");
additionalProperties.put("tsickleVersion", "0.43.0");
} else if (ngVersion.atLeast("11.0.0")) {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
wwwroot/*.js
node_modules
typings
dist
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
# OpenAPI Generator Ignore
# Generated by openapi-generator https://github.com/openapitools/openapi-generator

# Use this file to prevent files from being overwritten by the generator.
# The patterns follow closely to .gitignore or .dockerignore.

# As an example, the C# client generator defines ApiClient.cs.
# You can make changes and tell OpenAPI Generator to ignore just this file by uncommenting the following line:
#ApiClient.cs

# You can match any string of characters against a directory, file or extension with a single asterisk (*):
#foo/*/qux
# The above matches foo/bar/qux and foo/baz/qux, but not foo/bar/baz/qux

# You can recursively match patterns against a directory, file or extension with a double asterisk (**):
#foo/**/qux
# This matches foo/bar/qux, foo/baz/qux, and foo/bar/baz/qux

# You can also negate patterns with an exclamation (!).
# For example, you can ignore all files in a docs folder with the file extension .md:
#docs/*.md
# Then explicitly reverse the ignore rule for a single file:
#!docs/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
.gitignore
README.md
api.module.ts
api/api.ts
api/pet.service.ts
api/store.service.ts
api/user.service.ts
configuration.ts
encoder.ts
git_push.sh
index.ts
model/apiResponse.ts
model/category.ts
model/models.ts
model/order.ts
model/pet.ts
model/tag.ts
model/user.ts
variables.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
5.3.1-SNAPSHOT
Original file line number Diff line number Diff line change
@@ -0,0 +1,203 @@
## @

### Building

To install the required dependencies and to build the typescript sources run:
```
npm install
npm run build
```

### publishing

First build the package then run ```npm publish dist``` (don't forget to specify the `dist` folder!)

### consuming

Navigate to the folder of your consuming project and run one of next commands.

_published:_

```
npm install @ --save
```

_without publishing (not recommended):_

```
npm install PATH_TO_GENERATED_PACKAGE/dist.tgz --save
```

_It's important to take the tgz file, otherwise you'll get trouble with links on windows_

_using `npm link`:_

In PATH_TO_GENERATED_PACKAGE/dist:
```
npm link
```

In your project:
```
npm link
```

__Note for Windows users:__ The Angular CLI has troubles to use linked npm packages.
Please refer to this issue https://github.com/angular/angular-cli/issues/8284 for a solution / workaround.
Published packages are not effected by this issue.


#### General usage

In your Angular project:


```
// without configuring providers
import { ApiModule } from '';
import { HttpClientModule } from '@angular/common/http';

@NgModule({
imports: [
ApiModule,
// make sure to import the HttpClientModule in the AppModule only,
// see https://github.com/angular/angular/issues/20575
HttpClientModule
],
declarations: [ AppComponent ],
providers: [],
bootstrap: [ AppComponent ]
})
export class AppModule {}
```

```
// configuring providers
import { ApiModule, Configuration, ConfigurationParameters } from '';

export function apiConfigFactory (): Configuration {
const params: ConfigurationParameters = {
// set configuration parameters here.
}
return new Configuration(params);
}

@NgModule({
imports: [ ApiModule.forRoot(apiConfigFactory) ],
declarations: [ AppComponent ],
providers: [],
bootstrap: [ AppComponent ]
})
export class AppModule {}
```

```
// configuring providers with an authentication service that manages your access tokens
import { ApiModule, Configuration } from '';

@NgModule({
imports: [ ApiModule ],
declarations: [ AppComponent ],
providers: [
{
provide: Configuration,
useFactory: (authService: AuthService) => new Configuration(
{
basePath: environment.apiUrl,
accessToken: authService.getAccessToken.bind(authService)
}
),
deps: [AuthService],
multi: false
}
],
bootstrap: [ AppComponent ]
})
export class AppModule {}
```

```
import { DefaultApi } from '';

export class AppComponent {
constructor(private apiGateway: DefaultApi) { }
}
```

Note: The ApiModule is restricted to being instantiated once app wide.
This is to ensure that all services are treated as singletons.

#### Using multiple OpenAPI files / APIs / ApiModules
In order to use multiple `ApiModules` generated from different OpenAPI files,
you can create an alias name when importing the modules
in order to avoid naming conflicts:
```
import { ApiModule } from 'my-api-path';
import { ApiModule as OtherApiModule } from 'my-other-api-path';
import { HttpClientModule } from '@angular/common/http';

@NgModule({
imports: [
ApiModule,
OtherApiModule,
// make sure to import the HttpClientModule in the AppModule only,
// see https://github.com/angular/angular/issues/20575
HttpClientModule
]
})
export class AppModule {

}
```


### 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 { }
```
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
import { NgModule, ModuleWithProviders, SkipSelf, Optional } from '@angular/core';
import { Configuration } from './configuration';
import { HttpClient } from '@angular/common/http';

import { PetService } from './api/pet.service';
import { StoreService } from './api/store.service';
import { UserService } from './api/user.service';

@NgModule({
imports: [],
declarations: [],
exports: [],
providers: []
})
export class ApiModule {
public static forRoot(configurationFactory: () => Configuration): ModuleWithProviders<ApiModule> {
return {
ngModule: ApiModule,
providers: [ { provide: Configuration, useFactory: configurationFactory } ]
};
}

constructor( @Optional() @SkipSelf() parentModule: ApiModule,
@Optional() http: HttpClient) {
if (parentModule) {
throw new Error('ApiModule is already loaded. Import in your base AppModule only.');
}
if (!http) {
throw new Error('You need to import the HttpClientModule in your AppModule! \n' +
'See also https://github.com/angular/angular/issues/20575');
}
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
export * from './pet.service';
import { PetService } from './pet.service';
export * from './store.service';
import { StoreService } from './store.service';
export * from './user.service';
import { UserService } from './user.service';
export const APIS = [PetService, StoreService, UserService];
Loading