角6链接到其他组件中的部分？

Question

我有一个带有以下代码的导航栏组件：

 <ul class="navbar-nav mx-auto">
              <li class="nav-item active">
                <a class="nav-link" href="#" >Inicio <span class="sr-only"></span></a>
              </li>
              <li class="nav-item active">
                <a class="nav-link" href="#">Here Link Home Section 2 <span class="sr-only"></span></a>
              </li>


</ul>

并具有包含三个部分的另一个组件HomeComponent：

<section id="home_one">
    stuff 
    section
    one
</section>

<section id="home_two">
   stuff 
   section
   two
</section>

<section id="home_three">
    stuff 
    section
    three
</section>

如何从导航栏链接链接到另一个组件（homeComponent）中的特定部分（第2部分）？

Answer 1

Angular 6.1新增了称为anchorScrolling的功能，启用此选项并使用Router fragement

app.module.ts

@NgModule({
  imports: [BrowserModule, FormsModule, RouterModule.forRoot(routes, {
    anchorScrolling: 'enabled',
  })],
  declarations: [AppComponent, HelloComponent, ComponentbComponent],
  bootstrap: [AppComponent]
})

app.component.html

<a [routerLink]="['item']" [fragment]="'section2'">
    section2
</a>
<router-outlet></router-outlet>

示例：https：//stackblitz.com/edit/angular-zgmsuw