AngularJs waith before dom content loaded

Question

I want to hide and create elements that are loaded by AngularJS.

The DOM is not entirely loaded when I'd like to execute my JS functions.

Issue : my query selector is not able to detect elements. And I don't want to use a timeout because it depends to the network of the user.

My code :

app.controller('RootController', function($scope, $http, $filter) {
  $scope.init = function() {
    // NULL here, but after dom loaded in the chrome console I get an array of elements
    console.log(document.querySelectorAll('table .actionslist'));
  }
});

https://stackoverflow.com/questions/18646756/how-to-run-function-in-angularjs-controller-on-document-ready — Dan, Apr 04 '20 at 16:57
What do you wish to do with the elements? Maybe there is a more *angular* way to achieve the same? — Anurag Srivastava, Apr 04 '20 at 17:04

score 0 · Answer 1 · edited Apr 05 '20 at 00:02

0

You can use the following code;

This will add a listener on viewContentLoaded and will execute the code inside it when DOM is fully loaded.

$scope.$on('$viewContentLoaded', function () {  
    console.log(document.querySelectorAll('table .actionslist'));
});

edited Apr 05 '20 at 00:02

georgeawg

48,608
13
72
95

answered Apr 04 '20 at 20:39

Ajinkya Bodade

491
1
5
11

AngularJs waith before dom content loaded

1 Answers1