Question

我在页脚中有一个链接到了条款页面，但我希望该链接转到术语网页的特定部分（术语第3段）。

以下是footer.component.html

的代码

<a routerLink="terms">Terms & conditions</a> | 
<a routerLink="terms">Privacy policy</a> | 
<a routerLink="terms">Cancellation policy</a>

在terms.component.html中，我希望在点击时打开页脚中的隐私政策链接。

<ol start="3">
    <li>INFORMATION SUBMITTED THROUGH OR TO OUR SERVICES</li>
</ol>

我们需要使用什么才能使这些工作？任何帮助表示赞赏。感谢。

Answer 1

以下是答案，

和<a routerLink="terms">Terms & conditions</a> | <a routerLink="terms">Privacy policy</a> | <a routerLink="terms">Cancellation policy</a>

而不仅仅是使用。 <a routerLink="terms">Terms & conditions</a>

像这样使用

 <a [routerLink]="['/terms']" fragment="terms"> Terms & conditions </a>
 <a [routerLink]="['/terms']" fragment="cancel"> Cancellation policy </a>
 <a [routerLink]="['/terms']" fragment="privacy"> Privacy policy </a>

页面应该像

<ol start="3" id="privacy" >
     <li>INFORMATION SUBMITTED THROUGH OR TO OUR SERVICES</li>
</ol>

 <ol start="3" id="terms" >
     <li>INFORMATION SUBMITTED THROUGH OR TO OUR SERVICES</li>
 </ol>

 <ol start="3" id="cancel" >
     <li>INFORMATION SUBMITTED THROUGH OR TO OUR SERVICES</li>
 </ol>

有关详细说明和用法，请参阅API。 - https://angular.io/api/router/RouterLink

Answer 2

要添加到@Rahul VV＆＃39的答案，我已经使用下面的事件scrollIntoView编辑了组件

footer.component.ts

import { Router, NavigationEnd } from '@angular/router';

constructor(router: Router) {
    router.events.subscribe(s => {
      if (s instanceof NavigationEnd) {
        const tree = router.parseUrl(router.url);
        if (tree.fragment) {
          const element = document.querySelector("#" + tree.fragment);
          if (element) { element.scrollIntoView(); }
        }
      }
    });
   }

Angular 2路由到网页的特定部分，从一个组件链接到另一个组件

2 个答案: