Implementing bxslider from controller in angularjs and slider image not loading + rails

Error: [$rootScope:inprog] $digest already in progress

Blockquote

.directive "slideit", ->
      restrict: 'A',
      replace: true,
      ntroller: "userPluginCtrl",
      scope: ->
        slideit: '=' 
      template: '<ul class="bxslider">' +
                     '<li ng-repeat="slide in slides">' +
                       '<img ng-src="{{slide.src}}" alt="" />' +
                     '</li>' +
                    '</ul>'
      link = (scope, elm, attrs) ->
        elm.ready ->
          scope.$apply ->
            scope.slides = scope.slideit

        elm.bxSlider
          adaptiveHeight: true
          mode: "fade"

Previous and next button is showing on slider but image not loading.

<div id="sliderwrapper"><div slideit="images"></div>
</div>

Now error is not showing, i have replace $evalAsync instead of $apply.

But image is not loading. Please help me out

$scope.base = 'http://localhost:3000';
  $scope.images = [
       {src: $scope.base + '/rank1.jpg' },
       {src: $scope.base + '/rank1.jpg' },
       {src: $scope.base + '/rank1.jpg' }
     ];