web-dev-qa-db-fra.com

window.onload ne fonctionne pas dans AngularJS

Ce code dans un simple fichier HTML fonctionne:

<script>
  function load() {
    alert("load event detected!");
  }
  window.onload = load;
</script>

Cependant, si je le mets dans le fichier index.html d'une application Web AngularJS, ce n'est pas le cas. Est-ce que quelqu'un sait pourquoi?

15
Curt

Appelez votre fonction avec ng-init

var app = angular.module('app',[]);
app.controller('myController', function($scope){
    $scope.load = function () {
        alert("load event detected!");
    }
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='app'>
  <div ng-controller='myController' ng-init='load()'></div>
</div>
11
Mo.

Je préfère mettre ce type de code dans la fonction app.run () d'angular.

par exemple.

angular
.module('testApp', ['someModule'])
.constant('aConstant', 'hi')
.config(function($rootProvider) {/*some routing here*/})
.run(['$window', function($window) {
  $window.onload = function() {/*do your thing*/};
}]);

vérifiez également ce bon article qui décrit l'ordre dans lequel certaines choses se produisent dans angular AngularJS app.run () documentation?

9
Αλέκος

les éléments suivants devraient fonctionner:

jQuery (function () {/ ** mes fonctions de chargement de fenêtre ** /})

puisque angular utilise un sous-ensemble de jquery de toute façon, vous pouvez également inclure la chose réelle.

mieux encore:
Au lieu d'utiliser cela, vous pouvez envisager d'utiliser la méthode angular pour initialiser les choses:

ce serait: http://docs.angularjs.org/api/ng.directive:ngInit

<any ng-init = "functionInController (quelque chose)" ...

pour le rendre invisible jusqu'à init: http://docs.angularjs.org/api/ng.directive:ngCloak

<tout ng-manteau .....

pour initialiser/personnaliser des parties entières: http://docs.angularjs.org/guide/directive

<tout nom de directive ....

4
Heinrich

Essayer

angular.element($window).bind('load', function() {
});
3
Dominik Ehrenberg