采用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文件
＆LT;！DOCTYPE HTML＆GT;
＆LT; HTML NG-应用=对myApp＆GT;
＆LT; HEAD＆GT;
＆LT; META HTTP-EQUIV =内容类型内容=text / html的;字符集= UTF-8/＆GT;
＆LT;标题＆GT;＆LT; /标题＆GT;
＆LT; /头＆GT;
＆LT;身体GT;
＆LT; DIV CLASS =容器＆GT;
＆LT; DIV NG-视图＆gt;＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;
应用程序文件
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屋！
