How to use vanilla JavaScript gist of jQuerys SlideUp method in AngularJS

Question

I would like to use this gist in my AngularJS project:

slide.js

It's a vanilla JavaScript version of JQuerys' slideUp and slideDown methods, I have included the script above the angular scripts just before the closing body tag (as I did with jQuery).

The animation section of my app that requires the jQuery slideUp and slidedown functions:

app.animation('.slide', function () {
   return {
      beforeAddClass: function (element, className, done) {
         if (className === 'ng-hide') {
             element.slideUp({ duration: 350 }, done);
         }
      },
      removeClass: function (element, className, done) {
         if (className === 'ng-hide') {
             //element.hide().slideDown({ duration: 350 }, done);
             element[0].style.display = "none";
             element.slideDown({ duration: 350 }, done);
         }
      }
   }
});

I've edited that section to remove 'hide()', another jQuery function. (Also on a side note element now returns undefined without specifying the first DOM element - [0]).

However it still doesn't seem to be working, what am I missing?

Answer 1

I noticed that my question got a few down votes, so I looked into the slide.js code, looks like it doesn't work exactly the same as jQuerys' slide methods anyway.

So in the end I built a cut down version of jQuery, that saves a few bites and works as expected.