首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何修复UI-route,其中路由在当前视图下加载前一个视图

如何修复UI-route,其中路由在当前视图下加载前一个视图
EN

Stack Overflow用户
提问于 2019-04-19 01:32:47
回答 1查看 23关注 0票数 0

我是angular的新手,我已经开始使用angular1 ui-route了。当我从一个视图(View1)移动到另一个视图(View2)时,视图2加载正常,但当我向下滚动时发现,视图1显示在视图2的下方。只有在通过ui-route导航时才能观察到此问题。在页面重新加载/刷新时,我发现它工作得很好。找不到原因。

库版本:

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.3.2/angular-ui-router.min.js"></script>  
<script src="https://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-2.5.0.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-animate.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-sanitize.js"></script>

在从仪表板移动到用户视图时,用户视图loads with dashboard视图在it.There下没有ui视图,除了body标签之外,应用程序中的其他位置没有ui视图。其他页面仅仅是模板/常见的html页面。

HTML :
<body ng-app="NoticeboardApp" ng-cloak>
  <div ui-view></div>
</body>


Route :
<a ui-sref="users"></a>
<a ui-sref="notifications"></a>

app.js :
.state('dashboard', {
        url: '/dashboard',
        templateUrl: 'pages/dashboard.html',
        controller: 'dashboardCtrl'
    })
    .state('users', {
        url: '/users',
        templateUrl: 'pages/user.html',
        controller: 'userCtrl'
    })
    .state('notifications', {
        url: '/notifications',
        templateUrl: 'pages/notification.html',
        controller: 'notificationCtrl'
    })



After routing, inspect element code shows two ui-view :
[inspect elements code][1]


  [1]: https://i.stack.imgur.com/Wa1hW.png
EN

回答 1

Stack Overflow用户

发布于 2019-04-19 03:06:43

如果我没记错的话,ui-router中有一个bug,你可以在新页面加载时滚动到顶部来解决这个问题。

$scope.$on('$stateChangeSuccess', function () {
    window.scrollTo(0, 0);
});
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/55751127

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档