Awesome
<p align="center"> <a href="https://github.com/Celtian/ngx-repeat" target="blank"><img src="assets/logo.svg?sanitize=true" alt="" width="120"></a> <h1 align="center">NgxRepeat</h1> </p>Angular directive for repeating HTML element by count
✓ Angular 18 compatible
Here's the demo or stackblitz live preview or codesandbox live preview
- Lightweight
- No dependencies!
- Directive way
🛠️ Install
- Use yarn (or npm) to install the package
yarn add ngx-repeat
- Add NgxRepeatDirective into your component`
import { NgxRepeatDirective } from 'ngx-repeat';
@Component({
standalone: true,
imports: [NgxRepeatDirective /*, ...*/],
// ...
})
or module
import { NgxRepeatDirective } from 'ngx-repeat';
@NgModule({
// ...
imports: [
// ...
NgxRepeatDirective
]
})
🚀 Quick start
Example code
<div
*ngxRepeat="3;
let index = index;
let even = even;
let odd = odd;
let first = first;
let last = last;"
>
{{ index }} {{ even }} {{ odd }} {{ first }} {{ last }}
</div>
Result
0 true false true false
1 false true false false
2 true false false true
🔧 Compatibility
Angular | ngx-repeat | Install |
---|---|---|
>= 14 | 2.x | yarn add ngx-repeat |
>= 12 | 1.x | yarn add ngx-repeat@1 |
>= 5 < 13 | 0.x | yarn add ngx-repeat@0 |
📦 Dependencies
None
🪪 License
Copyright © 2021 - 2024 Dominik Hladik
All contents are licensed under the MIT license.