window - window.onload 在 AngularJS 中不起作用

Question

简单 HTML 文件中的此代码有效：

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

但是，如果我将它放入 AngularJS 网络应用程序的 index.html 文件中，它不会。有谁知道为什么不？

Answer 1

调用你的函数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>

Answer 2

我更喜欢将这种代码放在 angular 的 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*/};
}]);

还可以查看这篇描述AngularJS app.run() 文档中某些事情发生的顺序的好帖子 吗？

Answer 3

以下应该有效：

jQuery(function(){ /** 我的窗口加载函数 **/ })

因为 Angular 无论如何都使用 jquery 的一个子集，所以你也可以包含真实的东西。

更好的是：
您可以考虑使用初始化事物的角度方式，而不是使用它：

那将是：http ://docs.angularjs.org/api/ng.directive:ngInit

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

使其在初始化之前不可见：http://docs.angularjs.org/api/ng.directive: ngCloak

< 任何 ng-cloak .....

初始化/自定义整个部分：http ://docs.angularjs.org/guide/directive

<任何指令名称....

Answer 4

尝试

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