Angular路由守衛 canActivate

2022-03-11 22:06:09 字數 832 閱讀 3696

作用

canactivate

控制是否允許進入路由。

canactivatechild

等同 canactivate,只不過針對是所有子路由。

關鍵**

建立路由守衛

import  from '@angular/core';

import from '@angular/router';

@injectable()

export class canactivateguard implements canactivate, canactivatechild

canactivate(

route: activatedroutesnapshot,

state: routerstatesnapshot,

): boolean 傳參過來的內容

console.log('該頁面所需許可權:'+route.data['permission']);

return true;

} canactivatechild(

route: activatedroutesnapshot,

state: routerstatesnapshot,

): boolean

}

設定路由守衛

,

//設定路由守衛為canactivateguard

canactivate: [canactivateguard],

}

示例**

參考資料

angular路由守衛

canactivate

Angular路由守衛

目前,任何使用者都能在任何時候導航到任何地方,對於大部分應用,這樣是存在安全問題的,某些使用者可能無權導航到目標元件,需要先登入 認證 在顯示目標元件前,可能需要先獲取某些資料。在離開元件前,可能要先儲存修改.需要詢問使用者 是否要放棄本次更改,而不用儲存它們?對於上述這些場景問題,往往需要在路由配...

Angular 路由守衛

angular路由 可以控制頁面跳轉 可以在多檢視間切換 angular路由守衛 在進入或離開某路由時,用於判斷是否可以離開 進入某路由 return true代表可以進入當前路由 return false代表不可以進入當前路由,但可以進入自定義的路由 路由守衛只只能應用於路由項上 路由守衛可以應用...

angular4 0 路由守衛詳解

在企業應用中許可權 複雜頁多路由資料處理 進入與離開路由資料處理這些是非常常見的需求。其實angular路由守衛屬性可以幫我們做更多有意義的事,而且非常簡單。angular 的route路由引數中除了熟悉的path component外,還包括四種是否允許路由啟用與離開的屬性。這裡我們只講canac...