From f50753856723227a4300d5dfb59402ffd72ed346 Mon Sep 17 00:00:00 2001
From: Zhicheng Wang <zcwang@thoughtworks.com>
Date: Sun, 28 Oct 2018 12:14:18 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9=E5=AE=8C=E4=BA=86?=
 =?UTF-8?q?=E5=8F=AF=E5=A4=8D=E7=94=A8=E5=8A=A8=E7=94=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 aio/content/guide/reusable-animations.md | 41 +++++++++++++++++++++++-
 1 file changed, 40 insertions(+), 1 deletion(-)

diff --git a/aio/content/guide/reusable-animations.md b/aio/content/guide/reusable-animations.md
index afd3c59f23..5727341e2c 100644
--- a/aio/content/guide/reusable-animations.md
+++ b/aio/content/guide/reusable-animations.md
@@ -1,40 +1,79 @@
 # Reusable animations
 
+# 可复用动画
+
 #### Prerequisites
 
+#### 前提条件
+
 A basic understanding of the  following concepts:
 
+对下列概念有基本的理解：
+
 * [Introduction to Angular animations](guide/animations)
+
+  [Angular 动画简介](guide/animations)
+
 * [Transition and triggers](guide/transition-and-triggers)
 
+  [转场与触发器](guide/transition-and-triggers)
+
 <hr>
 
 The [AnimationOptions](https://angular.io/api/animations/AnimationOptions) interface in Angular animations enables you to create animations that you can reuse across different components.
 
+Angular 动画库中的 [AnimationOptions](https://angular.io/api/animations/AnimationOptions) 接口让你能创建可以在不同组件之间复用的动画。
+
 ## Creating reusable animations
 
+## 创建可复用动画
+
 To create a reusable animation, use the [`animation()`](https://angular.io/api/animations/animation) method to define an animation in a separate `.ts` file and declare this animation definition as a `const` export variable. You can then import and reuse this animation in any of your app components using the [`useAnimation()`](https://angular.io/api/animations/useAnimation) API.
 
+要想创建可复用的动画，请使用 [`animation()`](https://angular.io/api/animations/animation) 方法来在独立的 `.ts` 文件中定义动画，并把该动画的定义声明为一个导出的 `const` 变量。然后你就可以在应用的组件代码中通过 [`useAnimation()`](https://angular.io/api/animations/useAnimation) 来导入并复用它了。
+
 <code-example path="animations/src/app/animations.ts" header="src/app/animations.ts" region="reusable" language="typescript" linenums="false">
 </code-example>
 
 In the above code snippet, `transAnimation` is made reusable by declaring it as an export variable.
 
+在上面的代码片段中，通过把 `transAnimation` 声明为一个导出的变量，就让它变成了可复用的。
+
 <div class="alert is-helpful">
 
 **Note:** The `height`, `opacity`, `backgroundColor`, and `time` inputs are replaced during runtime.
+
+**注意：**`height`、`opacity`、`backgroundColor` 和 `time` 这几个输入项会在运行期间被替换掉。 
+
 </div>
 
 You can import the reusable `transAnimation` variable in your component class and reuse it using the `useAnimation()` method as shown below.
 
+你可以在组件类中导入这个可复用的 `transAnimation` 变量，并通过 `useAnimation()` 方法来复用它。代码如下：
+
 <code-example path="animations/src/app/open-close.component.3.ts" header="src/app/open-close.component.ts" region="reusable" language="typescript" linenums="false">
 </code-example>
 
 ## More on Angular animations
 
+## 关于 Angular 动画的更多知识
+
 You may also be interested in the following:
 
+你可能还对下列内容感兴趣：
+
 * [Introduction to Angular animations](guide/animations)
+
+  [Angular 动画简介](guide/animations)
+
 * [Transition and triggers](guide/transition-and-triggers)
+
+  [转场与触发器](guide/transition-and-triggers)
+
 * [Complex animation Sequences](guide/complex-animation-sequences)
-* [Route transition animations](guide/route-animations)
\ No newline at end of file
+
+  [复杂动画序列](guide/complex-animation-sequences)
+
+* [Route transition animations](guide/route-animations)
+
+  [路由转场动画](guide/route-animations)