Skip to content

Commit 4f5ef98

Browse files
author
Zhicheng WANG
committed
docs: 翻译完了所有公开的 API 文档
1 parent 6f6345f commit 4f5ef98

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

53 files changed

+2459
-269
lines changed

src/cdk/a11y/aria-describer/aria-describer.ts

Lines changed: 141 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -13,37 +13,83 @@ import {addAriaReferencedId, getAriaReferenceIds, removeAriaReferencedId} from '
1313
/**
1414
* Interface used to register message elements and keep a count of how many registrations have
1515
* the same message and the reference to the message element used for the `aria-describedby`.
16+
*
17+
* 本接口用于注册消息元素并保留具有相同消息的注册数量的计数,以及用于 `aria-describedby` 对消息元素的引用。
18+
*
1619
*/
1720
export interface RegisteredMessage {
18-
/** The element containing the message. */
21+
/**
22+
* The element containing the message.
23+
*
24+
* 包含消息的元素。
25+
*
26+
*/
1927
messageElement: Element;
2028

21-
/** The number of elements that reference this message element via `aria-describedby`. */
29+
/**
30+
* The number of elements that reference this message element via `aria-describedby`.
31+
*
32+
* 通过 `aria-describedby` 引用此消息元素的元素数。
33+
*
34+
*/
2235
referenceCount: number;
2336
}
2437

25-
/** ID used for the body container where all messages are appended. */
38+
/**
39+
* ID used for the body container where all messages are appended.
40+
*
41+
* 用于追加所有消息的正文容器的 ID。
42+
*
43+
*/
2644
export const MESSAGES_CONTAINER_ID = 'cdk-describedby-message-container';
2745

28-
/** ID prefix used for each created message element. */
46+
/**
47+
* ID prefix used for each created message element.
48+
*
49+
* 用于所创建的每个消息元素的 ID 前缀。
50+
*
51+
*/
2952
export const CDK_DESCRIBEDBY_ID_PREFIX = 'cdk-describedby-message';
3053

31-
/** Attribute given to each host element that is described by a message element. */
54+
/**
55+
* Attribute given to each host element that is described by a message element.
56+
*
57+
* 用来指定消息元素描述的每个宿主元素的属性。
58+
*
59+
*/
3260
export const CDK_DESCRIBEDBY_HOST_ATTRIBUTE = 'cdk-describedby-host';
3361

34-
/** Global incremental identifier for each registered message element. */
62+
/**
63+
* Global incremental identifier for each registered message element.
64+
*
65+
* 每个已注册消息元素的全局增量标识符。
66+
*
67+
*/
3568
let nextId = 0;
3669

37-
/** Global map of all registered message elements that have been placed into the document. */
70+
/**
71+
* Global map of all registered message elements that have been placed into the document.
72+
*
73+
* 文档中所有已注册消息元素的全局映射。
74+
*
75+
*/
3876
const messageRegistry = new Map<string|Element, RegisteredMessage>();
3977

40-
/** Container for all registered messages. */
78+
/**
79+
* Container for all registered messages.
80+
*
81+
* 所有已注册消息的容器。
82+
*
83+
*/
4184
let messagesContainer: HTMLElement | null = null;
4285

4386
/**
4487
* Utility that creates visually hidden elements with a message content. Useful for elements that
4588
* want to use aria-describedby to further describe themselves without adding additional visual
4689
* content.
90+
*
91+
* 该实用工具创建带有消息内容的视觉不可见元素。对于希望使用 aria-describedby 来进一步描述自己而不想添加其他视觉内容的元素很有用。
92+
*
4793
*/
4894
@Injectable({providedIn: 'root'})
4995
export class AriaDescriber implements OnDestroy {
@@ -58,11 +104,17 @@ export class AriaDescriber implements OnDestroy {
58104
* Adds to the host element an aria-describedby reference to a hidden element that contains
59105
* the message. If the same message has already been registered, then it will reuse the created
60106
* message element.
107+
*
108+
* 为宿主元素添加一个由 aria-describedby 引用的不可见的消息元素。如果已经注册了相同的消息,则它将复用已创建的消息元素。
109+
*
61110
*/
62111
describe(hostElement: Element, message: string, role?: string): void;
63112

64113
/**
65114
* Adds to the host element an aria-describedby reference to an already-existing message element.
115+
*
116+
* 为宿主元素添加一个由 aria-describedby 引用的现有消息元素。
117+
*
66118
*/
67119
describe(hostElement: Element, message: HTMLElement): void;
68120

@@ -86,10 +138,20 @@ export class AriaDescriber implements OnDestroy {
86138
}
87139
}
88140

89-
/** Removes the host element's aria-describedby reference to the message. */
141+
/**
142+
* Removes the host element's aria-describedby reference to the message.
143+
*
144+
* 删除宿主元素由 aria-describedby 引用的消息。
145+
*
146+
*/
90147
removeDescription(hostElement: Element, message: string, role?: string): void;
91148

92-
/** Removes the host element's aria-describedby reference to the message element. */
149+
/**
150+
* Removes the host element's aria-describedby reference to the message element.
151+
*
152+
* 删除宿主元素由 aria-describedby 引用的消息元素。
153+
*
154+
*/
93155
removeDescription(hostElement: Element, message: HTMLElement): void;
94156

95157
removeDescription(hostElement: Element, message: string|HTMLElement, role?: string): void {
@@ -117,7 +179,12 @@ export class AriaDescriber implements OnDestroy {
117179
}
118180
}
119181

120-
/** Unregisters all created message elements and removes the message container. */
182+
/**
183+
* Unregisters all created message elements and removes the message container.
184+
*
185+
* 注销所有已创建的消息元素,并删除消息容器。
186+
*
187+
*/
121188
ngOnDestroy() {
122189
const describedElements =
123190
this._document.querySelectorAll(`[${CDK_DESCRIBEDBY_HOST_ATTRIBUTE}]`);
@@ -137,6 +204,9 @@ export class AriaDescriber implements OnDestroy {
137204
/**
138205
* Creates a new element in the visually hidden message container element with the message
139206
* as its content and adds it to the message registry.
207+
*
208+
* 在以消息为内容的可视隐藏消息容器元素中创建一个新元素,并将其添加到消息注册表中。
209+
*
140210
*/
141211
private _createMessageElement(message: string, role?: string) {
142212
const messageElement = this._document.createElement('div');
@@ -152,7 +222,12 @@ export class AriaDescriber implements OnDestroy {
152222
messageRegistry.set(getKey(message, role), {messageElement, referenceCount: 0});
153223
}
154224

155-
/** Deletes the message element from the global messages container. */
225+
/**
226+
* Deletes the message element from the global messages container.
227+
*
228+
* 从全局消息容器中删除消息元素。
229+
*
230+
*/
156231
private _deleteMessageElement(key: string|Element) {
157232
const registeredMessage = messageRegistry.get(key);
158233
const messageElement = registeredMessage && registeredMessage.messageElement;
@@ -162,7 +237,12 @@ export class AriaDescriber implements OnDestroy {
162237
messageRegistry.delete(key);
163238
}
164239

165-
/** Creates the global container for all aria-describedby messages. */
240+
/**
241+
* Creates the global container for all aria-describedby messages.
242+
*
243+
* 为所有由 aria-describedby 引用的消息创建全局容器。
244+
*
245+
*/
166246
private _createMessagesContainer() {
167247
if (!messagesContainer) {
168248
const preExistingContainer = this._document.getElementById(MESSAGES_CONTAINER_ID);
@@ -190,15 +270,25 @@ export class AriaDescriber implements OnDestroy {
190270
}
191271
}
192272

193-
/** Deletes the global messages container. */
273+
/**
274+
* Deletes the global messages container.
275+
*
276+
* 删除全局消息容器。
277+
*
278+
*/
194279
private _deleteMessagesContainer() {
195280
if (messagesContainer && messagesContainer.parentNode) {
196281
messagesContainer.parentNode.removeChild(messagesContainer);
197282
messagesContainer = null;
198283
}
199284
}
200285

201-
/** Removes all cdk-describedby messages that are hosted through the element. */
286+
/**
287+
* Removes all cdk-describedby messages that are hosted through the element.
288+
*
289+
* 删除以此元素为宿主的所有由 cdk-describedby 引用的消息。
290+
*
291+
*/
202292
private _removeCdkDescribedByReferenceIds(element: Element) {
203293
// Remove all aria-describedby reference IDs that are prefixed by CDK_DESCRIBEDBY_ID_PREFIX
204294
const originalReferenceIds = getAriaReferenceIds(element, 'aria-describedby')
@@ -209,6 +299,9 @@ export class AriaDescriber implements OnDestroy {
209299
/**
210300
* Adds a message reference to the element using aria-describedby and increments the registered
211301
* message's reference count.
302+
*
303+
* 把一个消息添加到由 aria-describedby 引用的元素,并递增已注册消息的引用计数。
304+
*
212305
*/
213306
private _addMessageReference(element: Element, key: string|Element) {
214307
const registeredMessage = messageRegistry.get(key)!;
@@ -223,6 +316,9 @@ export class AriaDescriber implements OnDestroy {
223316
/**
224317
* Removes a message reference from the element using aria-describedby
225318
* and decrements the registered message's reference count.
319+
*
320+
* 把一个消息从由 aria-describedby 引用的元素中删除,并递减已注册消息的引用计数。
321+
*
226322
*/
227323
private _removeMessageReference(element: Element, key: string|Element) {
228324
const registeredMessage = messageRegistry.get(key)!;
@@ -232,7 +328,12 @@ export class AriaDescriber implements OnDestroy {
232328
element.removeAttribute(CDK_DESCRIBEDBY_HOST_ATTRIBUTE);
233329
}
234330

235-
/** Returns true if the element has been described by the provided message ID. */
331+
/**
332+
* Returns true if the element has been described by the provided message ID.
333+
*
334+
* 如果元素已由提供的消息 ID 描述(described),则返回 true。
335+
*
336+
*/
236337
private _isElementDescribedByMessage(element: Element, key: string|Element): boolean {
237338
const referenceIds = getAriaReferenceIds(element, 'aria-describedby');
238339
const registeredMessage = messageRegistry.get(key);
@@ -241,7 +342,12 @@ export class AriaDescriber implements OnDestroy {
241342
return !!messageId && referenceIds.indexOf(messageId) != -1;
242343
}
243344

244-
/** Determines whether a message can be described on a particular element. */
345+
/**
346+
* Determines whether a message can be described on a particular element.
347+
*
348+
* 确定是否可以在特定元素上描述消息。
349+
*
350+
*/
245351
private _canBeDescribed(element: Element, message: string|HTMLElement|void): boolean {
246352
if (!this._isElementNode(element)) {
247353
return false;
@@ -262,18 +368,33 @@ export class AriaDescriber implements OnDestroy {
262368
return trimmedMessage ? (!ariaLabel || ariaLabel.trim() !== trimmedMessage) : false;
263369
}
264370

265-
/** Checks whether a node is an Element node. */
371+
/**
372+
* Checks whether a node is an Element node.
373+
*
374+
* 检查节点是否为元素节点。
375+
*
376+
*/
266377
private _isElementNode(element: Node): element is Element {
267378
return element.nodeType === this._document.ELEMENT_NODE;
268379
}
269380
}
270381

271-
/** Gets a key that can be used to look messages up in the registry. */
382+
/**
383+
* Gets a key that can be used to look messages up in the registry.
384+
*
385+
* 获取可用于在注册表中查找消息的键。
386+
*
387+
*/
272388
function getKey(message: string|Element, role?: string): string|Element {
273389
return typeof message === 'string' ? `${role || ''}/${message}` : message;
274390
}
275391

276-
/** Assigns a unique ID to an element, if it doesn't have one already. */
392+
/**
393+
* Assigns a unique ID to an element, if it doesn't have one already.
394+
*
395+
* 如果元素还没有,则为其分配一个唯一的 ID。
396+
*
397+
*/
277398
function setMessageId(element: HTMLElement) {
278399
if (!element.id) {
279400
element.id = `${CDK_DESCRIBEDBY_ID_PREFIX}-${nextId++}`;

src/cdk/a11y/aria-describer/aria-reference.ts

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,20 @@
66
* found in the LICENSE file at https://angular.io/license
77
*/
88

9-
/** IDs are delimited by an empty space, as per the spec. */
9+
/**
10+
* IDs are delimited by an empty space, as per the spec.
11+
*
12+
* 根据规范,ID 由空格分隔。
13+
*
14+
*/
1015
const ID_DELIMITER = ' ';
1116

1217
/**
1318
* Adds the given ID to the specified ARIA attribute on an element.
1419
* Used for attributes such as aria-labelledby, aria-owns, etc.
20+
*
21+
* 将指定 ID 添加到元素上特定的 ARIA 属性上。用于诸如 aria-labelledby,aria-owns 等属性。
22+
*
1523
*/
1624
export function addAriaReferencedId(el: Element, attr: string, id: string) {
1725
const ids = getAriaReferenceIds(el, attr);
@@ -24,6 +32,9 @@ export function addAriaReferencedId(el: Element, attr: string, id: string) {
2432
/**
2533
* Removes the given ID from the specified ARIA attribute on an element.
2634
* Used for attributes such as aria-labelledby, aria-owns, etc.
35+
*
36+
* 从元素上指定的 ARIA 属性中删除特定的 ID。用于诸如 aria-labelledby,aria-owns 等属性。
37+
*
2738
*/
2839
export function removeAriaReferencedId(el: Element, attr: string, id: string) {
2940
const ids = getAriaReferenceIds(el, attr);
@@ -39,6 +50,9 @@ export function removeAriaReferencedId(el: Element, attr: string, id: string) {
3950
/**
4051
* Gets the list of IDs referenced by the given ARIA attribute on an element.
4152
* Used for attributes such as aria-labelledby, aria-owns, etc.
53+
*
54+
* 获取元素上指定的 ARIA 属性引用的 ID 列表。用于诸如 aria-labelledby,aria-owns 等属性。
55+
*
4256
*/
4357
export function getAriaReferenceIds(el: Element, attr: string): string[] {
4458
// Get string array of all individual ids (whitespace delimited) in the attribute value

0 commit comments

Comments
 (0)