diff --git a/docs/zh-Hans/How-To/Customize-SignIn-Manager.md b/docs/zh-Hans/How-To/Customize-SignIn-Manager.md index a98c57e495..2b6f7a612f 100644 --- a/docs/zh-Hans/How-To/Customize-SignIn-Manager.md +++ b/docs/zh-Hans/How-To/Customize-SignIn-Manager.md @@ -42,14 +42,14 @@ public override async Task GetE { var auth = await Context.AuthenticateAsync(Microsoft.AspNetCore.Identity.IdentityConstants.ExternalScheme); var items = auth?.Properties?.Items; - if (auth?.Principal == null || items == null || !items.ContainsKey("LoginProviderKey")) + if (auth?.Principal == null || items == null || !items.ContainsKey(LoginProviderKey)) { return null; } if (expectedXsrf != null) { - if (!items.ContainsKey("XsrfKey")) + if (!items.ContainsKey(XsrfKey)) { return null; } diff --git a/docs/zh-Hans/UI/Angular/Dom-Insertion-Service.md b/docs/zh-Hans/UI/Angular/Dom-Insertion-Service.md index 2ff9f72239..197ef9255c 100644 --- a/docs/zh-Hans/UI/Angular/Dom-Insertion-Service.md +++ b/docs/zh-Hans/UI/Angular/Dom-Insertion-Service.md @@ -1,3 +1,130 @@ # Dom插入(Scripts与Styles) -TODO... \ No newline at end of file +你可以使用@abp/ng.core包提供的 `DomInsertionService` 以简单的方式的插入脚本与样式. + +## 入门 + +你不必在模块或组件级别提供 `DomInsertionService` ,因为它已经在**根中**提供. 你可以在组件,指令或服务中直接注入并使用它. + +```js +import { DomInsertionService } from '@abp/ng.core'; + +@Component({ + /* class metadata here */ +}) +class DemoComponent { + constructor(private domInsertionService: DomInsertionService) {} +} +``` + +## 用法 + +你可以使用 `DomInsertionService` 提供的 `insertContent` 方法去创建一个 `` 元素放置在 ``的末尾, `scriptElement` 类型是一个 `HTMLScriptElement`. + +请参考[ContentStrategy](./Content-Strategy.md)查看所有可用的内容策略以及如何构建自己的内容策略. + +> 重要说明: `DomInsertionService` 不会两次插入相同的内容. 为了再次添加内容你首先应该使用 `removeContent` 方法删除旧内容. + +### 如何插入Styles + +`insertContent` 方法的第一个参数需要一个 `ContentStrategy`. 如果传递 `StyleContentStrategy` 实例, `DomInsertionService` 将创建具有给定内容的 `` 元素放置在 ``的末尾, `styleElement` 类型是一个 `HTMLStyleElement`. + +请参考[ContentStrategy](./Content-Strategy.md)查看所有可用的内容策略以及如何构建自己的内容策略. +. +> 重要说明: `DomInsertionService` 不会两次插入相同的内容. 为了再次添加内容你首先应该使用 `removeContent` 方法删除旧内容. + +### 如何删除已插入的 Scripts & Styles + +如果你传递 `HTMLScriptElement` 或 `HTMLStyleElement` 做为 `removeContent` 方法的第一个参数, `DomInsertionService` 将删除给定的元素. + +```js +import { DomInsertionService, CONTENT_STRATEGY } from '@abp/ng.core'; + +@Component({ + /* class metadata here */ +}) +class DemoComponent { + private styleElement: HTMLStyleElement; + + constructor(private domInsertionService: DomInsertionService) {} + + ngOnInit() { + this.styleElement = this.domInsertionService.insertContent( + CONTENT_STRATEGY.AppendStyleToHead('body {margin: 0;}') + ); + } + + ngOnDestroy() { + this.domInsertionService.removeContent(this.styleElement); + } +} +``` + +在上面的示例中,销毁组件时,将从 `` 中删除 `` 元素. + +## API + +### insertContent + +```js +insertContent( + contentStrategy: ContentStrategy, +): T +``` + +- `contentStrategy` 是方法的重要参数,已经在上方进行说明. +- 根据给定的策略返回 `HTMLScriptElement` 或 `HTMLStyleElement`. + +### removeContent + +```js +removeContent(element: HTMLScriptElement | HTMLStyleElement): void +``` + +- `element` 参数是已插入的 `HTMLScriptElement` 或 `HTMLStyleElement` 元素,它们应由 `insertContent` 方法返回. + +## 下一步是什么? + +- [ContentProjectionService](./Content-Projection-Service.md) \ No newline at end of file diff --git a/docs/zh-Hans/UI/Angular/Permission-Management.md b/docs/zh-Hans/UI/Angular/Permission-Management.md index c562f7e9a7..1fd9c5f5d2 100644 --- a/docs/zh-Hans/UI/Angular/Permission-Management.md +++ b/docs/zh-Hans/UI/Angular/Permission-Management.md @@ -1,3 +1,79 @@ -# Permission Management +# 权限管理 -TODO... \ No newline at end of file +权限是为特定用户,角色或客户端授予或禁止的简单策略. 你可以在[ABP授权文档](../../Authorization.md)中阅读更多信息. + +您可以使用 `ConfigState` 的 `getGrantedPolicy` 选择器获取经过身份验证的用户的权限. + +你可以从Store中获取权限的布尔值: + +```js +import { Store } from '@ngxs/store'; +import { ConfigState } from '../states'; + +export class YourComponent { + constructor(private store: Store) {} + + ngOnInit(): void { + const canCreate = this.store.selectSnapshot(ConfigState.getGrantedPolicy('AbpIdentity.Roles.Create')); + } + + // ... +} +``` + +或者你可以通过 `ConfigStateService` 获取它: + +```js +import { ConfigStateService } from '../services/config-state.service'; + +export class YourComponent { + constructor(private configStateService: ConfigStateService) {} + + ngOnInit(): void { + const canCreate = this.configStateService.getGrantedPolicy('AbpIdentity.Roles.Create'); + } + + // ... +} +``` + +## 权限指令 + +你可以使用 `PermissionDirective` 来根据用户的权限控制DOM元素是否可见. + +```html +
+ 仅当用户具有`AbpIdentity.Roles`权限时,此内容才可见. +
+``` + +如上所示,你可以使用 `abpPermission` 结构指令从DOM中删除元素. + +该指令也可以用作属性指令,但是我们建议你将其用作结构指令. + +## 权限守卫 + +如果你想要在导航过程中控制经过身份验证的用户对路由的访问权限,可以使用 `PermissionGuard`. + +将 `requiredPolicy` 添加到路由模块中的 `routes`属性. + +```js +const routes: Routes = [ + { + path: 'path', + component: YourComponent, + canActivate: [PermissionGuard], + data: { + routes: { + requiredPolicy: 'AbpIdentity.Roles.Create', + }, + }, + }, +]; +``` + +授予的策略存储在 `ConfigState` 的 `auth` 属性中. + +## 下一步是什么? + +* [Config State](./Config-State.md) \ No newline at end of file diff --git a/docs/zh-Hans/UI/AspNetCore/Tag-Helpers/Index.md b/docs/zh-Hans/UI/AspNetCore/Tag-Helpers/Index.md index 20d1119969..628a63bfa7 100644 --- a/docs/zh-Hans/UI/AspNetCore/Tag-Helpers/Index.md +++ b/docs/zh-Hans/UI/AspNetCore/Tag-Helpers/Index.md @@ -12,18 +12,18 @@ ABP框架还向标准bootstrap组件添加了一些**实用的功能**. 这里是ABP框架包装的组件列表: +* [Alerts](Alerts.md) * [Buttons](Buttons.md) * [Cards](Cards.md) -* [Alerts](Alerts.md) -* [Tabs](Tabs.md) -* [Grids](Grids.md) -* [Modals](Modals.md) * [Collapse](Collapse.md) * [Dropdowns](Dropdowns.md) +* [Grids](Grids.md) * [List Groups](List-Groups.md) +* [Modals](Modals.md) * [Paginator](Paginator.md) * [Popovers](Popovers.md) * [Progress Bars](Progress-Bars.md) +* [Tabs](Tabs.md) * [Tooltips](Tooltips.md) * ...