2

Is there any sensible simple example of this?

There is a bunch of JS and jQuery code that needs to be run only after AngularJS has done all its job. There is no time to redesign and implement the existing JS/jQuery working code in the Angular "way".

Run JS code after Angular is done. As simple as that. Possible?

Fixing my question: the code should run after initial page load, i.e. - after AngularJS has done all initial DOM manipulations.

Thanks!

a1111exe
  • 641
  • 4
  • 18
  • Are you talking about the angular library or your angular application code? – morkro Aug 09 '14 at 15:53
  • 2
    Angular is never done. It sits there and reacts to events, like all javascript. You need to identify what code you need to run in response to what event. When you say angular being done, what do you mean? The page loaded? The route loaded? We cannot answer this question without a specific frame of context. – Lawrence Jones Aug 09 '14 at 15:57
  • Fixed my question, thanks: the code should run after initial page load, i.e. - after AngularJS has done all initial DOM manipulations. – a1111exe Aug 09 '14 at 16:08
  • 1
    Meanwhile found an extremely ugly hack that works I really don't want to use it: `myApp.directive('onAngLoad', function($timeout) { return { restrict: 'A', link: function(scope, element, attrs) { $timeout (function () { // regular JS and jQuery here }, 1000); } }; });` – a1111exe Aug 09 '14 at 16:15
  • If you preload all the template (may be with grunt-html2js), [this answer](http://stackoverflow.com/a/24829838/867480) might help. – runTarm Aug 09 '14 at 16:53
  • @runTarm thanks, I'll try to check this out.. – a1111exe Aug 09 '14 at 18:21

2 Answers2

1

You can use a combination of checking ...

$scope.$on('$viewContentLoaded', function(){  
// view content is loaded..
});

and loading after bootstrap with a lazy loader such as ocLazyLoad

ex.

$ocLazyLoad.load(['/foo.js']).then(function(){
// use foo.js
});
Chamilyan
  • 9,347
  • 10
  • 38
  • 67
1

Place this at the end of your html. it is equivalent of jquery document ready and executes after it.

<script>
  angular.element(document).ready(function () {
     //place your javascript and jquery code here to execute after
     //angular controller has done it's work
     alert('angular work is done. run javascript');
  });
</script>
JJ_Coder4Hire
  • 4,706
  • 1
  • 37
  • 25