web-dev-qa-db-ja.com

window.onloadがAngularJSで機能しない

単純なHTMLファイル内のこのコードは機能します。

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

ただし、AngularJS Webアプリのindex.htmlファイルに入れても、入れられません。なぜ誰かが知っていないのですか?

15
Curt

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.

私はこの種のコードを角度のapp.run()関数に置くことを好みます。

例えば.

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

angular AngularJS app.run()documentation? で発生する順序を表すこの素敵な投稿も確認してください

9
Αλέκος

以下はうまくいくはずです:

jQuery(function(){/ ** my window onload functions ** /})

angularはとにかくjqueryのサブセットを使用するため、本物を含めることもできます。

さらに良い:
これを使用する代わりに、angular方法で初期化する方法を使用することを検討できます。

それは次のようになります: http://docs.angularjs.org/api/ng.directive:ngInit

<任意のng-init = "functionInController(something)" ...

initまで非表示にするには: http://docs.angularjs.org/api/ng.directive:ngCloak

<ng-cloak .....

パーツ全体を初期化/カスタマイズするには: http://docs.angularjs.org/guide/directive

<任意のディレクティブ名....

4
Heinrich

試す

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