iSharkFly-Docs
/
angular-docs-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: sync to 6.0(DI & http)

This commit is contained in:
Zhicheng Wang 2018-05-08 13:45:32 +08:00
parent ccea077bfd
commit 18eb14ced0
2 changed files with 39 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
aio/content/guide/hierarchical-dependency-injection.md
View File

@ -311,7 +311,7 @@ You create a car component (A) that displays a car constructed from these three
你创建了一个车辆组件（A），它显示一个从另外三个通用服务构造出的车辆。 你创建了一个车辆组件（A），它显示一个从另外三个通用服务构造出的车辆。
Then you create a child component (B) that defines its own, _specialized_ providers for `CarService` and `EngineService` Then you create a child component (B) that defines its own, _specialized_ providers for `CarService` and `EngineService`
that have special capabilites suitable for whatever is going on in component (B). that have special capabilities suitable for whatever is going on in component (B).
然后，你创建一个子组件（B），它为 `CarService` 和 `EngineService` 定义了自己的*特殊的*提供商，它们具有更特殊的能力，适用于组件 B 的。 然后，你创建一个子组件（B），它为 `CarService` 和 `EngineService` 定义了自己的*特殊的*提供商，它们具有更特殊的能力，适用于组件 B 的。

75
aio/content/guide/http.md
View File

@ -446,10 +446,10 @@ to every `HttpClient` save method.
### 发起一个 POST 请求 ### 发起一个 POST 请求
Apps often POST data to a server. They POST when submitting a form. Apps often POST data to a server. They POST when submitting a form.
In the following example, the `HeroService` posts when adding a hero to the database. In the following example, the `HeroesService` posts when adding a hero to the database.
应用经常把数据 `POST` 到服务器。它们会在提交表单时进行 `POST`。 应用经常把数据 `POST` 到服务器。它们会在提交表单时进行 `POST`。
下面这个例子中，`HeroService` 在把英雄添加到数据库中时，就会使用 `POST`。 下面这个例子中，`HeroesService` 在把英雄添加到数据库中时，就会使用 `POST`。
<code-example <code-example
path="http/src/app/heroes/heroes.service.ts" path="http/src/app/heroes/heroes.service.ts"
@ -476,10 +476,8 @@ It takes two more parameters:
`httpOptions` - 这个例子中，该方法的选项[指定了所需的请求头](#adding-headers)。 `httpOptions` - 这个例子中，该方法的选项[指定了所需的请求头](#adding-headers)。
Of course it catches errors in much the same manner [described above](#error-details). Of course it catches errors in much the same manner [described above](#error-details).
It also _taps_ the returned observable in order to log the successful POST.
当然，它捕获错误的方式很像[前面描述的](#error-details)操作方式。 当然，它捕获错误的方式很像[前面描述的](#error-details)操作方式。
它还*窃听*了可观察对象的返回值，以记录成功的 `POST`。
The `HeroesComponent` initiates the actual POST operation by subscribing to The `HeroesComponent` initiates the actual POST operation by subscribing to
the `Observable` returned by this service method. the `Observable` returned by this service method.
@ -523,27 +521,18 @@ the `Observable` returned by this service method.
title="app/heroes/heroes.component.ts (deleteHero)" linenums="false"> title="app/heroes/heroes.component.ts (deleteHero)" linenums="false">
</code-example> </code-example>
The component isn't expecting a result from the delete operation, so it subscribes without a callback. Even though you are not using the result, you still have to subscribe. Calling the `subscribe()` method _executes_ the observable, which is what initiates the DELETE request.
该组件不会等待删除操作的结果，所以它的 subscribe （订阅）中没有回调函数。不过就算你不关心结果，也仍然要订阅它。调用 `subscribe()` 方法会**执行**这个可观察对象，这时才会真的发起 DELETE 请求。
<div class="alert is-important"> <div class="alert is-important">
You must call _subscribe()_ or nothing happens! You must call _subscribe()_ or nothing happens. Just calling `HeroesService.deleteHero()` **does not initiate the DELETE request.**
你必须调用 `subscribe()`，否则什么都不会发生。 你必须调用 `subscribe()`，否则什么都不会发生。仅仅调用 `HeroesService.deleteHero()` 是**不会发起 DELETE 请求的。**
</div> </div>
The component isn't expecting a result from the delete operation and
subscribes without a callback.
The bare `.subscribe()` _seems_ pointless.
该组件不关心删除操作返回的结果，订阅时也没有回调函数。
单纯的 `.subscribe()` 方法看似毫无意义。
In fact, it is essential.
Merely calling `HeroService.deleteHero()` **does not initiate the DELETE request.**
但实际上，它是必备的。
否则调用 `HeroService.deleteHero()` 时**不会发起 DELETE 请求**。
<code-example <code-example
path="http/src/app/heroes/heroes.component.ts" path="http/src/app/heroes/heroes.component.ts"
region="delete-hero-no-subscribe" linenums="false"> region="delete-hero-no-subscribe" linenums="false">
@ -551,9 +540,9 @@ Merely calling `HeroService.deleteHero()` **does not initiate the DELETE request
{@a always-subscribe} {@a always-subscribe}
### Always _subscribe_! **Always _subscribe_!**
### 别忘了*订阅*！ **别忘了*订阅*！**
An `HttpClient` method does not begin its HTTP request until you call `subscribe()` on the observable returned by that method. This is true for _all_ `HttpClient` _methods_. An `HttpClient` method does not begin its HTTP request until you call `subscribe()` on the observable returned by that method. This is true for _all_ `HttpClient` _methods_.
@ -569,8 +558,7 @@ The [`AsyncPipe`](api/common/AsyncPipe) subscribes (and unsubscribes) for you au
All observables returned from `HttpClient` methods are _cold_ by design. All observables returned from `HttpClient` methods are _cold_ by design.
Execution of the HTTP request is _deferred_, allowing you to extend the Execution of the HTTP request is _deferred_, allowing you to extend the
observable with additional operations such as `tap` and `catchError` observable with additional operations such as `tap` and `catchError` before anything actually happens.
before anything actually happens.
`HttpClient` 的所有方法返回的可观察对象都设计为*冷的*。 `HttpClient` 的所有方法返回的可观察对象都设计为*冷的*。
HTTP 请求的执行都是*延期执行的*，让你可以用 `tap` 和 `catchError` 这样的操作符来在实际执行什么之前，先对这个可观察对象进行扩展。 HTTP 请求的执行都是*延期执行的*，让你可以用 `tap` 和 `catchError` 这样的操作符来在实际执行什么之前，先对这个可观察对象进行扩展。
@ -610,10 +598,10 @@ req.subscribe();
### 发起 PUT 请求 ### 发起 PUT 请求
An app will send a PUT request to completely replace a resource with updated data. An app will send a PUT request to completely replace a resource with updated data.
The following `HeroService` example is just like the POST example. The following `HeroesService` example is just like the POST example.
应用可以发送 PUT 请求，来使用修改后的数据完全替换掉一个资源。 应用可以发送 PUT 请求，来使用修改后的数据完全替换掉一个资源。
下面的 `HeroService` 例子和 POST 的例子很像。 下面的 `HeroesService` 例子和 POST 的例子很像。
<code-example <code-example
path="http/src/app/heroes/heroes.service.ts" path="http/src/app/heroes/heroes.service.ts"
@ -630,9 +618,10 @@ in order to initiate the request.
## 高级用法 ## 高级用法
The above sections detail how to use the basic HTTP functionality in `@angular/common/http`, but sometimes you need to do more than make simple requests and get data back. We have discussed the basic HTTP functionality in `@angular/common/http`, but sometimes you need to do more than make simple requests and get data back.
我们已经讨论了 `@angular/common/http` 的基本 HTTP 功能，但有时候除了单纯发起请求和取回数据之外，你还要再做点别的。
上面这个小节中详细讲解了如何使用 `@angular/common/http` 中提供的基本 HTTP 功能，但有时候除了单纯发起请求和取回数据之外，你还要再做点别的。
### Configuring the request ### Configuring the request
@ -643,11 +632,11 @@ passed as the last argument to the `HttpClient` method.
待发送请求的其它方面可以通过传给 `HttpClient` 方法最后一个参数中的配置对象进行配置。 待发送请求的其它方面可以通过传给 `HttpClient` 方法最后一个参数中的配置对象进行配置。
You [saw earlier](#adding-headers) that the `HeroService` sets the default headers by You [saw earlier](#adding-headers) that the `HeroesService` sets the default headers by
passing an options object (`httpOptions`) to its save methods. passing an options object (`httpOptions`) to its save methods.
You can do more. You can do more.
[以前你曾在](#adding-headers) `HeroService` 中通过在其保存方法中传入配置对象 `httpOptions` 设置过默认头。 [以前你曾在](#adding-headers) `HeroesService` 中通过在其保存方法中传入配置对象 `httpOptions` 设置过默认头。
你还可以做更多。 你还可以做更多。
#### Update headers #### Update headers
@ -690,7 +679,9 @@ Here is a `searchHeroes` method that queries for heroes whose names contain the
region="searchHeroes" linenums="false"> region="searchHeroes" linenums="false">
</code-example> </code-example>
If there is a search term, the code constructs an options object with an HTML URL encoded search parameter. If the term were "foo", the GET request URL would be `api/heroes/?name=foo`. If there is a search term, the code constructs an options object with an HTML URL-encoded search parameter. If the term were "foo", the GET request URL would be `api/heroes/?name=foo`.
如果有搜索词，这段代码就会构造一个包含进行过 URL 编码的搜索词的选项对象。如果这个搜索词是“foo”，这个 GET 请求的 URL 就会是 `api/heroes/?name=foo`。
如果有搜索词，这段代码就会构造一个包含进行过 URL 编码的搜索词的选项对象。如果这个搜索词是“foo”，这个 GET 请求的 URL 就会是 `api/heroes/?name=foo`。 如果有搜索词，这段代码就会构造一个包含进行过 URL 编码的搜索词的选项对象。如果这个搜索词是“foo”，这个 GET 请求的 URL 就会是 `api/heroes/?name=foo`。
@ -707,7 +698,7 @@ The sample includes an _npm package search_ feature.
这个例子还包含了*搜索 npm 包*的特性。 这个例子还包含了*搜索 npm 包*的特性。
When the user enters a name in a search-box, the `PackageSearchComponent` sends When the user enters a name in a search-box, the `PackageSearchComponent` sends
a search request for a package with that name to the NPM web api. a search request for a package with that name to the NPM web API.
当用户在搜索框中输入名字时，`PackageSearchComponent` 就会把一个根据名字搜索包的请求发送给 NPM 的 web api。 当用户在搜索框中输入名字时，`PackageSearchComponent` 就会把一个根据名字搜索包的请求发送给 NPM 的 web api。
@ -740,12 +731,12 @@ That's easy to implement with RxJS operators, as shown in this excerpt.
</code-example> </code-example>
The `searchText$` is the sequence of search-box values coming from the user. The `searchText$` is the sequence of search-box values coming from the user.
It's defined as an RxJS `Subject`, which means it is an `Observable` It's defined as an RxJS `Subject`, which means it is a multicasting `Observable`
that can also produce values for itself by calling `next(value)`, that can also produce values for itself by calling `next(value)`,
as happens in the `search()` method. as happens in the `search()` method.
`searchText$` 是一个序列，包含用户输入到搜索框中的所有值。 `searchText$` 是一个序列，包含用户输入到搜索框中的所有值。
它定义成了 RxJS 的 `Subject` 对象，这表示它是一个 `Observable`，同时还可以自行调用 `next(value)` 来产生值。 它定义成了 RxJS 的 `Subject` 对象，这表示它是一个多播 `Observable`，同时还可以自行调用 `next(value)` 来产生值。
`search()` 方法中就是这么做的。 `search()` 方法中就是这么做的。
Rather than forward every `searchText` value directly to the injected `PackageSearchService`, Rather than forward every `searchText` value directly to the injected `PackageSearchService`,
@ -1295,10 +1286,10 @@ But an interceptor can change this to an _observable_ that emits more than once.
但是拦截器也可以把这个修改成发出多个值的*可观察对象*。 但是拦截器也可以把这个修改成发出多个值的*可观察对象*。
A revised version of the `CachingInterceptor` optionally returns an _observable_ that A revised version of the `CachingInterceptor` optionally returns an _observable_ that
immediately emits the cached response, sends the request to the npm web api anyway, immediately emits the cached response, sends the request to the NPM web API anyway,
and emits again later with the updated search results. and emits again later with the updated search results.
修改后的 `CachingInterceptor` 版本可以返回一个立即发出缓存的响应，然后仍然把请求发送到 npm 的 Web API，然后再把修改过的搜索结果重新发出一次。 修改后的 `CachingInterceptor` 版本可以返回一个立即发出缓存的响应，然后仍然把请求发送到 NPM 的 Web API，然后再把修改过的搜索结果重新发出一次。
<code-example <code-example
path="http/src/app/http-interceptors/caching-interceptor.ts" path="http/src/app/http-interceptors/caching-interceptor.ts"
@ -1612,12 +1603,22 @@ You should test the app's defenses against HTTP requests that fail.
你还要测试应用对于 HTTP 请求失败时的防护。 你还要测试应用对于 HTTP 请求失败时的防护。
Call `request.error()` with an `ErrorEvent` instead of `request.flush()`, as in this example. Call `request.flush()` with an error message, as seen in the following example.
那就调用 `request.error()`，并给它传入一个 `ErrorEvent`，而不是 `request.flush()`。例子如下： 调用 `request.flush()` 并传入一个错误信息，如下所示：
<code-example <code-example
path="http/src/testing/http-client.spec.ts" path="http/src/testing/http-client.spec.ts"
region="404" region="404"
linenums="false"> linenums="false">
</code-example> </code-example>
Alternatively, you can call `request.error()` with an `ErrorEvent`.
另外，你还可以使用 `ErrorEvent` 来调用 `request.error()`.
<code-example
path="http/src/testing/http-client.spec.ts"
region="network-error"
linenums="false">
</code-example>