⚡Examples
 • 
📝Documentation
 • 
🐛Issues

What is HTTP Resource Plugin?

The HTTP Resource plugin generates Angular services using the new experimental httpResource API instead of
traditional HttpClient. This provides automatic caching, state management, and reactive data loading for your OpenAPI
endpoints.

> ⚠️ Experimental Feature: httpResource is still experimental in Angular. Use with caution in production.

Installation

``bash
npm install @ng-openapi/http-resource ng-openapi --save-dev
`

Quick Start

$3

`typescript
// openapi.config.ts
import { GeneratorConfig } from 'ng-openapi';
import { HttpResourcePlugin } from '@ng-openapi/http-resource';

export default {
input: './swagger.json',
output: './src/api',
clientName: 'NgOpenApi',
plugins: [HttpResourcePlugin],
} as GeneratorConfig;
`

$3

`bash
ng-openapi -c openapi.config.ts
`

$3

`typescript
// app.config.ts
import { ApplicationConfig } from '@angular/core';
import { provideDefaultClient } from './api/providers';

export const appConfig: ApplicationConfig = {
providers: [
provideNgOpenApiClient({
basePath: 'https://api.example.com'
})
]
};
`

$3

`typescript
import { Component, inject } from '@angular/core';
import { UsersResource } from './api/resources';

@Component({
selector: 'app-users',
template:

`
src/api/
├── models/ # TypeScript interfaces
├── resources/ # HTTP Resource services
│ ├── index.ts # Resource exports
│ └── *.resource.ts # Generated resources
├── services/ # Traditional HttpClient services
├── providers.ts # Provider functions
└── index.ts # Main exports
``

Documentation

- 📖 Full Documentation
- 🎯 Angular httpResource Guide
- 🚀 Live Examples