https://github.com/Celtian/ngx-suspense-of
Angular directive that adds suspense to your app
https://github.com/Celtian/ngx-suspense-of
angular library
Last synced: 6 months ago
JSON representation
Angular directive that adds suspense to your app
- Host: GitHub
- URL: https://github.com/Celtian/ngx-suspense-of
- Owner: Celtian
- License: mit
- Created: 2021-02-20T13:36:03.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2025-02-15T20:53:38.000Z (9 months ago)
- Last Synced: 2025-04-14T07:48:09.367Z (7 months ago)
- Topics: angular, library
- Language: TypeScript
- Homepage: https://celtian.github.io/ngx-suspense-of
- Size: 3.16 MB
- Stars: 7
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md
Awesome Lists containing this project
- fucking-awesome-angular - ngx-suspense-of - Angular directive that adds suspense to your app. (Architecture and Advanced Topics / HTTP)
- awesome-angular - ngx-suspense-of - Angular directive that adds suspense to your app. (Architecture and Advanced Topics / HTTP)
README
NgxSuspenseOf
[](https://badge.fury.io/js/ngx-suspense-of)
[](https://www.npmjs.com/ngx-suspense-of)
[](https://www.npmjs.com/ngx-suspense-of)
[](https://snyk.io/advisor/npm-package/ngx-suspense-of)
[](https://codecov.io/gh/celtian/ngx-suspense-of/)
[](https://github.com/celtian/ngx-suspense-of/)
[](https://github.com/celtian/ngx-suspense-of/)
[](http://hits.dwyl.com/celtian/ngx-suspense-of)
> Angular directive for repeating HTML element by count
> ✓ _Angular 19 compatible_
Here's the [demo](http://celtian.github.io/ngx-suspense-of/) or [stackblitz live preview](https://stackblitz.com/edit/ngx-suspense-of) or [codesandbox live preview](https://codesandbox.io/s/ngx-suspense-of-60z62)
- 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
### Example code
```html
{{ data | json }}
Loading ...
Incoming data are empty
{{ error }}
Try again
```
```typescript
public onStateChange = (state: NgxSuspenseState): void => {
console.log(state);
};
```
## 🔧 Compatibility
| Angular | ngx-suspense-of | Install |
| --------- | --------------- | ---------------------------- |
| >= 14 | 2.x | `yarn add ngx-suspense-of` |
| >= 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](https://github.com/Celtian)
All contents are licensed under the [MIT license].
[mit license]: LICENSE