使用ng-view时，AngularJS document.ready不起作用

Question

在我的应用程序中的多个路线之间导航时，我在angularJS中遇到了document.ready的问题。 它只适用于我使用ctrl + f5（页面重新加载）; 它似乎在页面之间导航不会改变文档的状态以备就绪。

调节器

  angular.element(document).ready(function() {
    window.scrollTo(0,90);
});

主要的html文件

<!DOCTYPE html >
<html ng-app="myApp">
    <head>
        <meta http-equiv="content-type" content="text/html;charset=utf-8" />
        <title></title>
    </head>
    <body>
        <div class="container">
            <div ng-view></div>
        </div>
    </body>
</html>

应用文件

var mainModule = angular.module('myApp', ['ui.bootstrap.dialog']);
function viewServiceConfig($routeProvider) {
$routeProvider.
    when('/', {
        controller: SomeController,
        templateUrl: 'somehtml.html'
    }).



    when('/someroute', {
        controller: SomeRouteController,
        templateUrl: 'someroutehtml.html'
    }).


    otherwise({
        redirectTo: '/'
    });
}

mainModule.config(viewServiceConfig);

Answer 1

您可以在路径中定义的控制器中侦听，即$viewContentLoaded事件的 SomeController和SomeRouteController 。 每次重新加载ngView内容时都会发出$viewContentLoaded并且应该在angularjs中路由时提供与document.ready类似的功能：

function SomeController($scope) {
   $scope.$on('$viewContentLoaded', function() {window.scrollTo(0,90);});
}

加载index.html时， document.ready也只会被触发一次。 加载路径配置中定义的部分模板时，不会触发它。

Answer 2

扩展@davekr的答案，我发现我需要添加$ timeout以确保摘要已完成并且html元素可用于查询：

function SomeController($scope) {
    $scope.$on('$viewContentLoaded', function() {
        $timeout(function(){
            //Do your stuff
        });
    });
}

我尝试了很多其他事件，这是唯一可行的方法。

Answer 3

我能够通过Dave的答案和使用routeChangeSuccess来应用滚动事件

function SomeController($scope) {
    $scope.$on('$routeChangeSuccess', function() {window.scrollTo(0,90);});
}

使用ng-view时，AngularJS document.ready不起作用

问题描述

3 个解决方案

解决方案1
40 已采纳 2013-07-30 12:04:06

解决方案2
6 2016-03-22 09:54:37

解决方案3
4 2013-07-30 12:55:48

使用ng-view时，AngularJS document.ready不起作用

问题描述

3 个解决方案

解决方案1 40 已采纳 2013-07-30 12:04:06

解决方案2 6 2016-03-22 09:54:37

解决方案3 4 2013-07-30 12:55:48

解决方案1
40 已采纳 2013-07-30 12:04:06

解决方案2
6 2016-03-22 09:54:37

解决方案3
4 2013-07-30 12:55:48