Merge pull request #18063 from abpframework/guards-update-doc

Update documentation for functional guards

docs/en/Community-Articles/2023-04-15-Converting-Create-Edit-Modal-To-Page/POST.md

@@ -315,7 +315,7 @@ import { CreateBookComponent } from './create-book/create-book.component';
 import { EditBookComponent } from './edit-book/edit-book.component';
 
 const routes: Routes = [
-  { path: '', component: BookComponent, canActivate: [AuthGuard, PermissionGuard] },
+  { path: '', component: BookComponent, canActivate: [authGuard, permissionGuard] },
   { path: 'create', component: CreateBookComponent },
   { path: 'edit/:id', component: EditBookComponent },
 ];

docs/en/Startup-Templates/Application.md

@@ -316,7 +316,7 @@ You should add `routes` property in the `data` object to add a link on the menu
 {
    path: 'dashboard',
    loadChildren: () => import('./dashboard/dashboard.module').then(m => m.DashboardModule),
-   canActivate: [AuthGuard, PermissionGuard],
+   canActivate: [authGuard, permissionGuard],
    data: {
       routes: {
          name: 'ProjectName::Menu:Dashboard',
@@ -328,7 +328,7 @@ You should add `routes` property in the `data` object to add a link on the menu
 }
 ```
 In the above example;
-*  If the user is not logged in, AuthGuard blocks access and redirects to the login page.
+*  If the user is not logged in, authGuard blocks access and redirects to the login page.
 *  PermissionGuard checks the user's permission with the `requiredPolicy` property of the `routes` object. If the user is not authorized to access the page, the 403 page appears.
 *  The `name` property of `routes` is the menu link label. A localization key can be defined.
 *  The `iconClass` property of the `routes` object is the menu link icon class.

docs/en/Tutorials/Part-5.md

@@ -323,11 +323,11 @@ Open the `/src/app/book/book-routing.module.ts` and replace with the following c
 ````js
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
-import { AuthGuard, PermissionGuard } from '@abp/ng.core';
+import { authGuard, permissionGuard } from '@abp/ng.core';
 import { BookComponent } from './book.component';
 
 const routes: Routes = [
-  { path: '', component: BookComponent, canActivate: [AuthGuard, PermissionGuard] },
+  { path: '', component: BookComponent, canActivate: [authGuard, permissionGuard] },
 ];
 
 @NgModule({
@@ -337,8 +337,8 @@ const routes: Routes = [
 export class BookRoutingModule {}
 ````
 
-* Imported `AuthGuard` and `PermissionGuard` from the `@abp/ng.core`.
-* Added `canActivate: [AuthGuard, PermissionGuard]` to the route definition.
+* Imported `authGuard` and `permissionGuard` from the `@abp/ng.core`.
+* Added `canActivate: [authGuard, permissionGuard]` to the route definition.
 
 Open the `/src/app/route.provider.ts` and add `requiredPolicy: 'BookStore.Books'` to the `/books` route. The `/books` route block should be following:
 

docs/en/UI/Angular/OAuth-Module.md

@@ -6,7 +6,6 @@ If your app is version 7.0 or higher, you should include "AbpOAuthModule.forRoot
 Those abstractions can be found in the @abp/ng-core packages.
 - `AuthService` (the class that implements the IAuthService interface).
 - `NAVIGATE_TO_MANAGE_PROFILE` Inject token.
-- `AuthGuard` (the class that implements the IAuthGuard interface).
 - `ApiInterceptor` (the class that implements the IApiInterceptor interface).
 
 Those base classes are overridden by the "AbpOAuthModule" for oAuth. There are also three functions provided with AbpOAuthModule.

docs/en/UI/Angular/Permission-Management.md

@@ -54,20 +54,20 @@ As shown above you can remove elements from DOM with `abpPermission` structural
 
 ## Permission Guard
 
-You can use `PermissionGuard` if you want to control authenticated user's permission to access to the route during navigation.
+You can use `permissionGuard` if you want to control authenticated user's permission to access to the route during navigation.
 
 * Import the PermissionGuard from @abp/ng.core.
-* Add `canActivate: [PermissionGuard]` to your route object.
+* Add `canActivate: [permissionGuard]` to your route object.
 * Add `requiredPolicy` to the `data` property of your route in your routing module.
 
 ```js
-import { PermissionGuard } from '@abp/ng.core';
+import { permissionGuard } from '@abp/ng.core';
 // ...
 const routes: Routes = [
   {
     path: 'path',
     component: YourComponent,
-    canActivate: [PermissionGuard],
+    canActivate: [permissionGuard],
     data: {
         requiredPolicy: 'YourProjectName.YourComponent', // policy key for your component
     },

docs/zh-Hans/Startup-Templates/Application.md

@@ -302,7 +302,7 @@ ABP 配置模块也已经导入到 `AppModule` 中, 以满足可延迟加载 ABP
 {
    path: 'dashboard',
    loadChildren: () => import('./dashboard/dashboard.module').then(m => m.DashboardModule),
-   canActivate: [AuthGuard, PermissionGuard],
+   canActivate: [authGuard, permissionGuard],
    data: {
       routes: {
          name: 'ProjectName::Menu:Dashboard',
@@ -315,7 +315,7 @@ ABP 配置模块也已经导入到 `AppModule` 中, 以满足可延迟加载 ABP
 ```
 在上面的例子中;
 *  如果用户没有登录,  AuthGuard 会阻塞访问并重定向到登录页面. 
-*  PermissionGuard 使用 `rotues` 对象的 `requiredPolicy` 属性检查用户的权限. 如果用户未被授权访问该页, 则显示403页. 
+*  permissionGuard 使用 `rotues` 对象的 `requiredPolicy` 属性检查用户的权限. 如果用户未被授权访问该页, 则显示403页. 
 *  `routes` 的 `name` 属性是菜单链接标签. 可以定义本地化 key. 
 *  `routes` 对象的 `iconClass` 属性是菜单链接图标类. 
 *  `routes` 对象的 `requiredPolicy` 属性是访问页面所需的策略 key. 

docs/zh-Hans/Tutorials/Part-5.md

@@ -389,11 +389,11 @@ UI的第一步是防止未认证用户看见"图书"菜单项并进入图书管
 ````js
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
-import { AuthGuard, PermissionGuard } from '@abp/ng.core';
+import { authGuard, permissionGuard } from '@abp/ng.core';
 import { BookComponent } from './book.component';
 
 const routes: Routes = [
-  { path: '', component: BookComponent, canActivate: [AuthGuard, PermissionGuard] },
+  { path: '', component: BookComponent, canActivate: [authGuard, permissionGuard] },
 ];
 
 @NgModule({
@@ -403,8 +403,8 @@ const routes: Routes = [
 export class BookRoutingModule {}
 ````
 
-* 从 `@abp/ng.core` 引入 `AuthGuard` 和 `PermissionGuard`.
-* 在路由定义中添加 `canActivate: [AuthGuard, PermissionGuard]`.
+* 从 `@abp/ng.core` 引入 `authGuard` 和 `permissionGuard`.
+* 在路由定义中添加 `canActivate: [authGuard, permissionGuard]`.
 
 打开 `/src/app/route.provider.ts`, 在 `/books` 路由中添加 `requiredPolicy: 'BookStore.Books'`. `/books` 路由应该如以下配置:
 

docs/zh-Hans/UI/Angular/Permission-Management.md

@@ -53,20 +53,20 @@ export class YourComponent {
 
 ## 权限守卫
 
-如果你想要在导航过程中控制经过身份验证的用户对路由的访问权限,可以使用 `PermissionGuard`.
+如果你想要在导航过程中控制经过身份验证的用户对路由的访问权限,可以使用 `permissionGuard`.
 
-* 从@abp/ng.core导入PermissionGuard.
-* 添加 `canActivate: [PermissionGuard]` 到你的路由对象.
+* 从@abp/ng.core导入permissionGuard.
+* 添加 `canActivate: [permissionGuard]` 到你的路由对象.
 * 添加  `requiredPolicy` 到路由模块路由的 `data` 属性.
 
 ```js
-import { PermissionGuard } from '@abp/ng.core';
+import { permissionGuard } from '@abp/ng.core';
 // ...
 const routes: Routes = [
   {
     path: 'path',
     component: YourComponent,
-    canActivate: [PermissionGuard],
+    canActivate: [permissionGuard],
     data: {
         requiredPolicy: 'YourProjectName.YourComponent', // policy key for your component
     },