1.0.1 • Published 1 year ago
ngx-mat-menu-infinite-scroll v1.0.1
ngx-mat-menu-infinite-scroll
Adds missing infinite scroll functionality for an Angular Material Menu.
Installation
npm install ngx-mat-menu-infinite-scroll@latestSince the directive is marked as standalone you can directly import it into a module.
import { NgModule } from '@angular/core';
import { MatMenuInfiniteScrollDirective } from 'ngx-mat-menu-infinite-scroll';
@NgModule({
declarations: [...],
imports: [
MatMenuInfiniteScrollDirective
],
exports: [...]}) export class AppModule { }
Usage
<button
mat-button
[matMenuTriggerFor]="menu"
matMenuInfiniteScroll
(scrolled)="loadMore()"
>Menu</button>
<mat-menu #menu="matMenu">
@for(item of items; track $index) {
<!-- Menu items to show... -->
}
</mat-menu>Optional inputs/outputs
| Keyword | Function | Note |
|---|---|---|
| threshold | Threshold for triggering the 'scrolled' event | Default = 20, optional |
| debounce | Debounce time to control the frequency of emitting 'scrolled' event (in milliseconds) | Default = 500, optional |
| activeUntil | Input property that stops scrolling when a specified condition evaluates to false. | If the condition is false, scrolling stops., optional |
| (scrolled) | Event emitted when the menu content is scrolled to the specified threshold |
If you like my work, you can
License
This project is licensed under the MIT License - see the LICENSE file for details.