0

This is a basic directive to detect scrolling to the bottom of an iframe but it is not kicking off, do you see an issue?

(function() {
  angular.module('myapp').directive('textAgreement', function($timeout) {
    return {
      restrict: 'A',    
      scope: true,
      compile: function(tElement) {
        tElement.append('<div ng-show="bottom">There is more...</div>');
        return function(scope, element) {
          var elm = element[0];        
          var check = function() {
            scope.bottom = (elm.offsetHeight + elm.scrollTop >= elm.scrollHeight);
          };
          var appliedCheck = function() {
            scope.$apply(check);
          };
          element.bind('scroll', appliedCheck);
          check();        
          $timeout(check,500);          
          }; 
      }    
    };
  });   
})();

Here is the HTML:

<div class="row">
    <div class="col-xs-12 body-text">
        <h4>Use Agreement</h4>
        <div class="col-xs-12" id="tos" class="load-iframe">
            <iframe text-agreement id="agreeFrame" class="agree-frame" src="{{ ::trustSrcAgreementUri }}"  style="border:0" width="100%" height="100%"></iframe>
        </div>
    </div>
</div>
Berlin Brown
  • 11,504
  • 37
  • 135
  • 203

1 Answers1

0

I can't test your code becuase you didn't added something to work with but I think you are not listening correctly on your iframe element. Yo have to bind the event to the document element of the iframe.

look at this answer

Community
  • 1
  • 1
Dvir
  • 3,287
  • 1
  • 21
  • 33
  • I got ya, how can you reference the 'window' within an iframe based on the code above. This is binding to the 'scroll' event of the iframe, I wonder if it is possible to create a directive to scroll on the irame.window – Berlin Brown Nov 17 '15 at 23:09
  • This is a little better, more tied to angularjs. – Berlin Brown Nov 17 '15 at 23:24