View loading and javascript that changes elements in the view

[alis...@codebrane.com]

Hiya,

I must be missing something but there doesn't appear to be a way to get javascript to work with a view. e.g. a view contains elements that are changed by another javascript framework (photoswipe) but when the javascript runs in index.html the view doesn't exist so it fails. If I add onload to ng-view to get the controller to run the photoswipe init function it causes rootScope:infdig. document onready runs before the document is 'ready' i.e. before the template has loaded. Is there a best practice for using other frameworks with angular that require javascript to be run after the template is loaded?

thanks,

Alistair

[Sander Elias]

Hi Alistair,

Have a look at the $viewContentLoaded event of ngView.

In your controller you can do something like:

$scope.on('$viewContentLoaded',function () {
   //kick of your 3rth party thing.
})

Does that help you a bit?

Regards

Sander

[alis...@codebrane.com]

thanks Sander but that's what I do. I took the document onready code out to a separate function and call it from viewContentLoaded. That's when I get the infdig error. The javascript in PhotoSwipe seems to cause the angular view to reload, which calls viewContentLoaded, which tells PhotoSwipe to init which causes angular to reload...

Alistair

[alis...@codebrane.com]

After removing the otherwise route I got to see PhotoSwipe adding query params to the url based on gallery stuff. That seemed to be causing a route reload and redirect, which added query params, which reloaded, which redirected and so on. Turns out it's PhotoSwipe and there's a simple solution. history: false

https://github.com/dimsemenov/PhotoSwipe/issues/580

Alistair

[Sander Elias]

Hi Alistair,

Good you got it resolved! 

Regards

Sander