jedgard
jedgard

Reputation: 868

AngularJS wait until element is fully loaded

I am currently working on a pdftron implementation and it looks like the webviewer is not loaded fast enough at the point when webviwer tries to load the document. How would you set some kind of ready element so it waits until the webViewer is ready to load a document?.

    viewer = new PDFTron.WebViewer({
        path: 'WebViewer',
        type: 'html5',
        documentType: 'pdf'
    }, element);

    $scope.watch('url', function(blobVal) {
      viewer.loadDocument(blobVal);
    }

I am getting an undefined on viewer.loadDocument and its because viewer is not fully loaded. It happens intermittently.

Upvotes: 1

Views: 1507

Answers (3)

Yasser
Yasser

Reputation: 41

You want to wait for the WebViever ready event. Please see the guide below: https://www.pdftron.com/documentation/web/guides/fundamentals/webviewer#details-of-instantiation

var myWebViewer = new PDFTron.WebViewer({
  initialDoc: 'mydoc.pdf',
  ui: 'legacy'
}, viewerElement);

viewerElement.addEventListener('ready', function() {
  // API functions are now ready to be called on myWebViewer
});

Please also see the following link: https://www.pdftron.com/api/web/PDFTron.WebViewer.html#event:ready__anchor

Upvotes: 2

Majesty
Majesty

Reputation: 1919

I believe the following code makes more sense

   $scope.viewer = new PDFTron.WebViewer({
        path: 'WebViewer',
        type: 'html5',
        documentType: 'pdf'
    }, element);

    $scope.$watch('viewer', function(newVal, oldVal) {
      if (newVal instanceof Blob && newWal !== oldVal) {
        viewer.loadDocument(newVal);
      }
    }

Upvotes: 0

Emirhan ÖZKAN
Emirhan ÖZKAN

Reputation: 79

You can use javascript timeout.

setTimeout(function(){
       // You can write functions that will load after Angular elements.
},500);

Upvotes: -1

Related Questions