javascript - 使用ng-show和$ window.onload在页面加载后显示元素

我有一个mainController，如下所示。我想在完成ng-show的页面加载后显示div。页面加载后，我的$scope.windowLoaded为true，但是不显示ng-show的div。

angular.module('myApp')
  .controller('mainController', function ($scope, $window) {

    $scope.windowLoaded = false;
    console.log('loading completed: ' + $scope.windowLoaded);
    $window.onload = function() {
      $scope.windowLoaded = true;
      console.log('loading completed: ' + $scope.windowLoaded);
    };

  });

的HTML：

<div ng-show="windowLoaded == true">
    Show this div after pageload succeeded.
</div>

最佳答案

问题似乎是ng-show="windowLoaded == 'true'"。您正在检查windowLoaded是否等于true的字符串而不是布尔值。

替换为：

<div ng-show="windowLoaded == true">
    Show this div after pageload succeeded.
</div>

Working Example



如果在此之后问题仍然存在，请尝试将范围语句包装在$timeout中以确保已将其应用：

$window.onload = function() {
    $timeout(function() {
        $scope.windowLoaded = true;
    });
};

不过请记住将$timeout传递给控制器​​。