Angular：使用片段滚动锚点时出错

Question

所以，我的项目中有这个header.component.ts ，带有指向主页所有部分的链接。

        <nav class="nav-menu d-none d-lg-block">
        <ul>
            <li class="active"><a [routerLink]="['/']" [routerLinkActive]="'active'">Home</a></li>
            <li><a [routerLink]="['/']" fragment="portfolio" [routerLinkActive]="'active'">Portfólio</a></li>
            <li><a [routerLink]="['/']" fragment="services" [routerLinkActive]="'active'">Serviços</a></li>
            <li><a [routerLink]="['/']" fragment="contact" [routerLinkActive]="'active'">Contato</a></li>
        </ul>
    </nav>

我已经更改了我的app.routing.module以便启用锚滚动：

@NgModule({
  imports: [
    RouterModule.forRoot(routes, {
      scrollPositionRestoration: 'enabled',
      anchorScrolling: 'enabled'
    })
  ],
  exports: [RouterModule]
})

问题是：每次我点击一个链接，而不是滚动到具有相关id的部分，我的页面回到顶部。 有什么我做错了吗？

---

编辑：我在这里创建了一个 stackblitz ，但是它得到了一个编译器错误

Answer 1

您必须向响应部分添加 id，因为 Angular 将自动滚动到具有给定片段 id 的元素。

Answer 2

得到了答案。 原来是我使用的模板上的脚本有问题。 一旦我删除了脚本（这是为了提供平滑的滚动），我的问题就解决了。 谢谢@divin-irakiza 和@chellappan-வ 的帮助！