采用NG-视图时AngularJS的document.ready不起作用 [英] AngularJS document.ready doesn't work when using ng-view
问题描述
我在几个应用程序之间的航线航行时在angularJS有问题的document.ready。它只是当我使用Ctrl + F5(页面重载)的作品;似乎网页间导航不会改变文档的状态做好准备。
控制器
angular.element(文件)。就绪(函数(){
window.scrollTo(0,90);
});
主HTML文件
<!DOCTYPE HTML>
< HTML NG-应用=对myApp>
< HEAD>
< META HTTP-EQUIV =内容类型内容=text / html的;字符集= UTF-8/>
<标题>< /标题>
< /头>
<身体GT;
< DIV CLASS =容器>
< DIV NG-视图>< / DIV>
< / DIV>
< /身体GT;
< / HTML>
应用程序文件
VAR mainModule = angular.module('对myApp',['ui.bootstrap.dialog']);
功能viewServiceConfig($ routeProvider){
$ routeProvider。
什么时候('/', {
控制器:SomeController,
templateUrl:somehtml.html
})。 当('/ someroute',{
控制器:SomeRouteController,
templateUrl:someroutehtml.html
})。
除此以外({
redirectTo:'/'
});
}mainModule.config(viewServiceConfig);
您可以在路由定义即 SomeController
和 SomeRouteController <你的控制器听/ code>
$ viewContentLoaded
事件。 $ viewContentLoaded
发出每次ngView内容被重新装载,并应提供类似的功能,随着时间的路由的时候的document.ready
angularjs:
函数SomeController($范围){
$ $范围在('$ viewContentLoaded',函数(){window.scrollTo(0,90);});
}
的的document.ready
也触发只有当你加载你的 index.html的
一次。当你的路由配置定义的部分模板加载它不会被触发。
I have a problem with document.ready in angularJS when navigating between several routes in my app. It only works when I use ctrl+f5 (page reload); it seems navigating between pages does not change state of the document to ready.
Controller
angular.element(document).ready(function() {
window.scrollTo(0,90);
});
Main html file
<!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>
app file
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);
You can listen in your controllers defined in routes i.e. SomeController
and SomeRouteController
for $viewContentLoaded
event. $viewContentLoaded
is emitted every time the ngView content is reloaded and should provide similar functionality as the document.ready
when routing in angularjs:
function SomeController($scope) {
$scope.$on('$viewContentLoaded', function() {window.scrollTo(0,90);});
}
The document.ready
is also triggered only once when you load your index.html
. It is not triggered when the partial templates defined in your route configuration are loaded.
这篇关于采用NG-视图时AngularJS的document.ready不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!