fuseScrollbar is a wrapper directive for Perfect Scrollbar plugin.

Exported as: fuseScrollbar

Module

import { FuseScrollbarModule } from '@fuse/directives/scrollbar';

Usage

Here's the basic usage of the fuseScrollbar:

<div fuseScrollbar [fuseScrollbarOptions]="{wheelPropagation: false, suppressScrollX: true}"> A very long content to add scrollbars. </div>

Properties

Methods

It's possible to access the methods of this directive using a @ViewChild or @ViewChildren:

<!-- Content #1 with custom scrollbar --> <div fuseScrollbar> A very long content to add scrollbars. </div> <!-- Content #2 with custom scrollbar --> <div fuseScrollbar> Another long content to add scrollbars. </div> import { FuseScrollbarDirective } from '@fuse/directives/scrollbar/scrollbar.directive'; @ViewChildren(FuseScrollbarDirective) private _fuseScrollbarDirectives: QueryList<FuseScrollbarDirective> ngAfterViewInit(): void { // Iterate through the directives and update all of them fuseScrollbarDirectives.forEach((fuseScrollbarDirective) => { fuseScrollbarDirective.update(); }); }

Here's the list of all available methods: