0

I'm trying to use the perfect-scrollbar plugin on AngularJS website, but I get the error:

TypeError: element.getAttribute is not a function at getId (http://localhost/Myproject/js/lib/perfect-scrollbar.jquery.js:1299:20) at Object.exports.get (http://localhost/Myproject/js/lib/perfect-scrollbar.jquery.js:1334:20)

What is done:

// connections
link href="css/perfect-scrollbar.min.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="js/lib/perfect-scrollbar.jquery.js"></script>
<script src="js/lib/perfect-scrollbar.js"></script>

//styles
.carousel-in-circles {
  position: relative;
  overflow: hidden;
  width: 100%; /* I need horizontal scrollbar only */
}

// directive use
<div class="carousel-in-circles" perfect-scrollbar>...</div>

// angularJS directive
angular.module('myproject.directives').
    directive('perfectScrollbar', function () {
        return {
            link: function (el) {
                $(document).ready(function (){
                    $(el).perfectScrollbar();
                });                
            }
        };
    });

I cannot cope with it, hope for some advice...

huysentruitw
  • 27,376
  • 9
  • 90
  • 133
Tetyana Mandzyuk
  • 3
  • 3

1 Answers1

0

If your website is angular, then I would use the angular version of perfect scrollbar here:

https://github.com/itsdrewmiller/angular-perfect-scrollbar

Using jQuery plugins on top of angular is not what it was designed to do.

jsdeveloper
  • 3,945
  • 1
  • 15
  • 14