-
Notifications
You must be signed in to change notification settings - Fork 137
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
translate: guide/pipe-template (#904)
- Loading branch information
1 parent
da99612
commit 407cd89
Showing
2 changed files
with
22 additions
and
6 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
# Using a pipe in a template | ||
|
||
To apply a pipe, use the pipe operator (`|`) within a template expression as shown in the following code example. | ||
|
||
<code-example header="birthday.component.html (template)" path="pipes/src/app/birthday.component.html"></code-example> | ||
|
||
The component's `birthday` value flows through the pipe operator (`|`) to the [`DatePipe`](api/common/DatePipe) whose pipe name is `date`. | ||
The pipe renders the date in the default format as **Apr 15, 1988**. | ||
|
||
Look at the component class. | ||
|
||
<code-example header="birthday.component.ts (class)" path="pipes/src/app/birthday.component.ts"></code-example> | ||
|
||
Because this is a [standalone component](guide/standalone-components), it imports the `DatePipe` from `@angular/common`, the source of all built-in pipes. | ||
|
||
@reviewed 2023-08-14 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,16 +1,16 @@ | ||
# Using a pipe in a template | ||
# テンプレート内でのパイプの使用 | ||
|
||
To apply a pipe, use the pipe operator (`|`) within a template expression as shown in the following code example. | ||
パイプを適用するために、次のコードの例に示されるように、テンプレート式内部でパイプ演算子(`|`)を使用します。 | ||
|
||
<code-example header="birthday.component.html (template)" path="pipes/src/app/birthday.component.html"></code-example> | ||
|
||
The component's `birthday` value flows through the pipe operator (`|`) to the [`DatePipe`](api/common/DatePipe) whose pipe name is `date`. | ||
The pipe renders the date in the default format as **Apr 15, 1988**. | ||
`birthday`の値はパイプ演算子(`|`)を通じてnameが`date`の[`DatePipe`](api/common/DatePipe)に流れます。 | ||
パイプはdateをデフォルトフォーマットの**Apr 15, 1988**に変換します。 | ||
|
||
Look at the component class. | ||
コンポーネントクラスを見てください。 | ||
|
||
<code-example header="birthday.component.ts (class)" path="pipes/src/app/birthday.component.ts"></code-example> | ||
|
||
Because this is a [standalone component](guide/standalone-components), it imports the `DatePipe` from `@angular/common`, the source of all built-in pipes. | ||
これは[スタンドアロンコンポーネント](guide/standalone-components)のため、すべての組み込みパイプの源である`@angular/common`から`DatePipe`をインポートします。 | ||
|
||
@reviewed 2023-08-14 |