Skip to content

Commit 407cd89

Browse files
authored
translate: guide/pipe-template (#904)
1 parent da99612 commit 407cd89

File tree

2 files changed

+22
-6
lines changed

2 files changed

+22
-6
lines changed
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
# Using a pipe in a template
2+
3+
To apply a pipe, use the pipe operator (`|`) within a template expression as shown in the following code example.
4+
5+
<code-example header="birthday.component.html (template)" path="pipes/src/app/birthday.component.html"></code-example>
6+
7+
The component's `birthday` value flows through the pipe operator (`|`) to the [`DatePipe`](api/common/DatePipe) whose pipe name is `date`.
8+
The pipe renders the date in the default format as **Apr 15, 1988**.
9+
10+
Look at the component class.
11+
12+
<code-example header="birthday.component.ts (class)" path="pipes/src/app/birthday.component.ts"></code-example>
13+
14+
Because this is a [standalone component](guide/standalone-components), it imports the `DatePipe` from `@angular/common`, the source of all built-in pipes.
15+
16+
@reviewed 2023-08-14
Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
1-
# Using a pipe in a template
1+
# テンプレート内でのパイプの使用
22

3-
To apply a pipe, use the pipe operator (`|`) within a template expression as shown in the following code example.
3+
パイプを適用するために、次のコードの例に示されるように、テンプレート式内部でパイプ演算子(`|`)を使用します。
44

55
<code-example header="birthday.component.html (template)" path="pipes/src/app/birthday.component.html"></code-example>
66

7-
The component's `birthday` value flows through the pipe operator (`|`) to the [`DatePipe`](api/common/DatePipe) whose pipe name is `date`.
8-
The pipe renders the date in the default format as **Apr 15, 1988**.
7+
`birthday`の値はパイプ演算子(`|`)を通じてnameが`date`[`DatePipe`](api/common/DatePipe)に流れます。
8+
パイプはdateをデフォルトフォーマットの**Apr 15, 1988**に変換します。
99

10-
Look at the component class.
10+
コンポーネントクラスを見てください。
1111

1212
<code-example header="birthday.component.ts (class)" path="pipes/src/app/birthday.component.ts"></code-example>
1313

14-
Because this is a [standalone component](guide/standalone-components), it imports the `DatePipe` from `@angular/common`, the source of all built-in pipes.
14+
これは[スタンドアロンコンポーネント](guide/standalone-components)のため、すべての組み込みパイプの源である`@angular/common`から`DatePipe`をインポートします。
1515

1616
@reviewed 2023-08-14

0 commit comments

Comments
 (0)