Package Exports

@mr-scroll/angular

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@mr-scroll/angular) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@mr-scroll/angular

The best custom scroll for the web.

This is the angular wrapper. Check here (root of this repo) for an overview on mr-scroll.

Install

npm i @mr-scroll/core @mr-scroll/angular

Angular 10 and above is supported.

Note: If you're using css-theming, check the css-theming support package.

Usage

Import the global CSS styles in your angular.json, in projects>angular>architect>build>options>styles:

"styles": [
  "node_modules/@mr-scroll/core/dist/styles.css",
  //...
]

Example from sample here.

Import ScrollModule into your module.

Example from sample here.

Use mr-scroll component:

<mr-scroll>
  Content
</mr-scroll>

For more general usage info check the README in the root of this repo.

NOTE: The scrolled event is the only event that won't trigger change detection. This is by design as it's fired a lot. If you need change detection when you react to it, you can do this easily by using NgZone:

// Inject NgZone in your component
constructor(private _zone: NgZone) { }

_onScrolled() {
  _zone.Run(() => {
    // Handle the event
  });
}