NgxSuspenseOf


> Angular directive for repeating HTML element by count

> ✓ _Angular 20 compatible_

Here's the demo or stackblitz live preview or codesandbox live preview

- Lightweight
- No dependencies!
- Directive way

🛠️ Install

1. Use yarn (or npm) to install the package

``terminal
yarn add ngx-suspense-of
`

2. Add NgxSuspenseOfDirective into your imports

`typescript
import { NgxSuspenseOfDirective } from 'ngx-suspense-of';

@Component({
standalone: true,
imports: [
// ...
NgxSuspenseOfDirective
],
})
`

or

`typescript
import { NgxSuspenseOfDirective } from 'ngx-suspense-of';

@NgModule({
// ...
imports: [
// ...
NgxSuspenseOfDirective
]
})
`

🚀 Quick start

$3

`html
*ngxSuspense="
let data of observable;
loading: loading;
empty: empty;
error: error
stateChangeFn: onStateChange"
>


{{ data | json }}

{{ error }}

`typescript
public onStateChange = (state: NgxSuspenseState): void => {
console.log(state);
};
`

🔧 Compatibility

| Angular | ngx-suspense-of | Install |
| --------- | --------------- | ---------------------------- |
| >= 20 | 3.x | yarn add ngx-suspense-of |
| >= 14 | 2.x | yarn add ngx-suspense-of@2 |
| >= 12 | 1.x | yarn add ngx-suspense-of@1 |
| >= 5 < 13 | 0.x | yarn add ngx-suspense-of@0` |

📦 Dependencies

_None_

🪪 License

Copyright © 2021 - 2025 Dominik Hladik

All contents are licensed under the [MIT license].

[mit license]: LICENSE