ng-class for ui-scroll

by dhilt

HTML

<script src="https://code.angularjs.org/1.3.14/angular.js "></script>

<div ng-controller="MainController">
    <ul ui-scroll-viewport class="list" >    
        <li ui-scroll="item in datasource" buffer-size="20" ng-class="{'odd': item.id % 2}">
            <span>{{item.text}}</span>
        </li>
    </ul>
</div>

CSS

.odd {
    color: red;
}

.list {
    height: auto !important;
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 0;
    right: 0;
    overflow: auto;
    font-size: 1.5em;
    background-color: #F3F3F3;
    color: black;
}

JavaScript

/*!
 * angular-ui-scroll
 * https://github.com/angular-ui/ui-scroll.git
 * Version: 1.3.2 -- 2015-09-03T15:39:10.862Z
 * License: MIT
 */
 

 (function () {
'use strict';
angular.module('ui.scroll.jqlite', ['ui.scroll']).service('jqLiteExtras', [
  '$log', '$window', function(console, window) {
    return {
      registerFor: function(element) {
        var convertToPx, css, getMeasurements, getStyle, getWidthHeight, isWindow, scrollTo;
        css = angular.element.prototype.css;
        element.prototype.css = function(name, value) {
          var elem, self;
          self = this;
          elem = self[0];
          if (!(!elem || elem.nodeType === 3 || elem.nodeType === 8 || !elem.style)) {
            return css.call(self, name, value);
          }
        };
        isWindow = function(obj) {
          return obj && obj.document && obj.location && obj.alert && obj.setInterval;
        };
        scrollTo = function(self, direction, value) {
          var elem, method, preserve, prop, ref;
          elem = self[0];
          ref = {
            top: ['scrollTop', 'pageYOffset', 'scrollLeft'],
            left: ['scrollLeft', 'pageXOffset', 'scrollTop']
          }[direction], method = ref[0], prop = ref[1], preserve = ref[2];
          if (isWindow(elem)) {
            if (angular.isDefined(value)) {
              return elem.scrollTo(self[preserve].call(self), value);
            } else {
              if (prop in elem) {
                return elem[prop];
              } else {
                return elem.document.documentElement[method];
              }
            }
          } else {
            if (angular.isDefined(value)) {
              return elem[method] = value;
            } else {
              return elem[method];
            }
          }
        };
        if (window.getComputedStyle) {
          getStyle = function(elem) {
            return window.getComputedStyle(elem, null);
          };
          convertToPx = function(elem, value) {
  ...