本文介紹Route interface里常用字段的使用方法。

https://angular.io/api/router/Route#description

path

• Can be a wild card (**) that matches any URL (see Usage Notes below). Default is “/” (the root path).

兩個星號：代表任意匹配。

pathMatch

The path-matching strategy, one of ‘prefix’ or ‘full’. Default is ‘prefix’.

By default, the router checks URL elements from the left to see if the URL matches a given path, and stops when there is a match. For example, ‘/team/11/user’ matches ‘team/:id’.

The path-match strategy ‘full’ matches against the entire URL. It is important to do this when redirecting empty-path routes. Otherwise, because an empty path is a prefix of any URL, the router would apply the redirect even when navigating to the redirect destination, creating an endless loop.

默認模式為default，非貪婪匹配。

例子：

const CUSTOM_ROUTES: Routes = [{ path: "/custom/:id", component: RouteDemoComponent } ];

http://localhost:4200/custom/123

可以工作：

http://localhost:4200/custom/123/12

測試結果發現，即使使用默認的pathMatch，也會報錯，這一點和Angular文檔不符。

component

當path匹配時，該字段指向的Component會被實例化。

The component to instantiate when the path matches. Can be empty if child routes specify components.

outlet

Name of a RouterOutlet object where the component can be placed when the path matches.

canActivate

An array of dependency-injection tokens used to look up CanActivate() handlers, in order to determine if the current user is allowed to activate the component. By default, any user can activate.

data

應用開發人員通過ActivatedRoute接口傳入的額外數據。

更多Jerry的原創文章，盡在：“汪子熙”:

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的Angular Route数据结构里常用字段使用方法一览的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。