代码之家  ›  专栏  ›  技术社区  ›  Mr X

滚动到顶部,标题服务在6中不能并行工作

  •  0
  • Mr X  · 技术社区  · 6 年前
    this.document.body.scrollTop = 0;
            this.router.routeReuseStrategy.shouldReuseRoute = function() {
                return false;
            };
    
        /* Activated change detection for the title change */
        this.router.events
            .filter((event) => event instanceof NavigationEnd)
            .map(() => this.activatedRoute)
            .map((route) => {
                while (route.firstChild) {
                    route = route.firstChild;
                }
                return route;
            })
            .filter((route) => route.outlet === 'primary')
            .mergeMap((route) => route.data)
            .subscribe((event) => {
                this.titleService.setTitle(event['title']);
                this.metaService.addTag(event['meta']);
            });
    

    const appRoutes: Routes = [
        {
            path: '',
            loadChildren: './main/pages/pages.module#PagesModule',
            data: {
                title: 'Home Page',
                meta: {name: 'description', content: 'hello its home'}
            }
        },
        {
            path: '**',
            redirectTo: '/you-know-nothing-jon-snow'
        }
    ];
    

    此外,我需要使用滚动到顶部的几个动态网址页面滚动到顶部每次点击。如果我删除routeReuseStrategy setTitle工作,并使用router设置标题,两者都不能一起工作,我绑定了其他选项,但它们中的任何一个在应用程序中都不能按预期工作。

    1 回复  |  直到 6 年前
        1
  •  0
  •   Tzach Ovadia    6 年前

    这是一个黑客,但你可以尝试使用 setTimeout :

    .subscribe((event) => {
            this.titleService.setTitle(event['title']);
            this.metaService.addTag(event['meta']);
            setTimeout(() => this.document.body.scrollTop = 0);
        });
    

    顺便说一句,你也可以使用 window.scrollTo

    window.scrollTo({ top: 0, behavior: "smooth" });
    
    推荐文章