Skip to content

Commit

Permalink
translate: guide/pipe-template (#904)
Browse files Browse the repository at this point in the history
  • Loading branch information
darkss-xyzzy authored Jan 18, 2024
1 parent da99612 commit 407cd89
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 6 deletions.
16 changes: 16 additions & 0 deletions aio-ja/content/guide/pipe-template.en.md
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
12 changes: 6 additions & 6 deletions aio-ja/content/guide/pipe-template.md
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

0 comments on commit 407cd89

Please sign in to comment.