angular-smooth-scrollbar v7.2.0

angular-smooth-scrollbar

smooth-scrollbar for angular projects.

Requirements

Angular 1.4+

Install

Via npm:

npm install angular-smooth-scrollbar --save

Or via bower:

bower install angular-smooth-scrollbar --save

Demo

http://idiotwu.github.io/angular-smooth-scrollbar/

Usage

1. Include all dependencies in your page file:

   <link rel="stylesheet" href="smooth-scrollbar/dist/smooth-scrollbar.css">
   
   <script src="angular.js"></script>
   <script src="smooth-scrollbar/dist/smooth-scrollbar.js"></script>
   <script src="angular-smooth-scrollbar/dist/angular-smooth-scrollbar.js"></script>

2. Add SmoothScrollbar as dependency to your angular app:

   angular.module('myApp', ['SmoothScrollbar']);

3. Use it wherever you want:

   • As element:

     <scrollbar name="scrollbar_name">
         ...
     </scrollbar>

   • As attribute:

     <section scrollbar="scrollbar_name">
         ...
     </section>

Available Options

Confusing with the option field? Try edit tool here!

ScrollbarServiceProvider

You can configure default scrollbar behavior here:

angular.module('myApp', ['SmoothScrollbar'])
.config((ScrollbarServiceProvider) => {
    // set default scrollbar behavior
});

ScrollbarServiceProvider.setDefaultOptions( options )

Set default scrollbar options for your angular app.

ScrollbarService

By given scrollbar a name via attribute, you can access your scrollbar instances through ScrollbarService.

    <scrollbar name="myScrollbar">...</scrollbar>

app.controller('MyCtrl', (ScrollbarService) => {
    const myScrollbar = ScrollbarService.getInstance('myScrollbar');
    ...
});

ScrollbarService.generateName()

Return a timestamp string, this will be useful while trying naming scrollbars uniquely.

ScrollbarService.getInstance( name )

Get scrollbar instance by giving the name, and return a promise with instance.

ScrollbarService.destroyInstance( name )

Destroy scrollbar with the given name.

APIs

Documents

License

MIT.