Angular 5中的RouterLink在DevTooL上未顯示真實路徑

Question

我想知道是我找不到的錯誤或規范。 在Angular 5中，當我像這樣使用routerLink時

<button routerLink="/account/order/{{this.orderService.order._id}}/messages">Messages</button>

一切正常，我可以在組件中路由到URL /account/order/5aaaa0c6fd204609b3bd2577/messages 。 但是，如果我打開Chrome DevTools（我也在Firefox DevTools中嘗試過），我會看到這樣的一行：

<button _ngcontent-c4="" class="btn" tabindex="0" ng-reflect-router-link="/account/order/5aaaa0c6fd20460">Messages</button>

我嘗試為routerLink使用不同的分配，但是對於所有這些，我都削減了實際的href（我在component.ts中創建了url字符串，而在routerLink和其他方法（如[routerLink]創建）中僅放置了字符串變量）。 第一次看起來ng-reflect-router-link沒有那么長。 但是我嘗試在href和DevTools中使用簡單的字符串，我看到這樣的正常鏈接：

<button _ngcontent-c4="" class="btn" routerlink="/123456789123456789123456789123456789123456789123456789123456789" tabindex="0" ng-reflect-router-link="/12345678912345678912345678912">Messages</button>

有人知道，為什么我要削減真正的href？ 也許存在針對此行為的專門化或文檔，或者這看起來像是一個錯誤，我需要在GitHub angular repo上創建問題？

Answer 1

GitHub問題的解釋。

由於可訪問性問題，用於導航通常不是一個好主意。 參見https://marcysutton.com/links-vs-buttons-in-modern-web-applications/

據我所知，如果將[routerLink]應用於錨標記，則href會被適當地設置-href是用戶將鼠標懸停在鏈接上時看到的東西。 按鈕沒有href（或應該沒有），因此您不會看到屬性反映到DOM中。

ng-reflect---- properties僅用於調試/ devtime，並且被截斷了，因此它們不會將大量數據轉儲到DOM中。