update _cache
This commit is contained in:
parent
c12d75a477
commit
470426d5e0
|
@ -9,8 +9,6 @@ block includes
|
||||||
- var _redirectTo = 'redirectTo'
|
- var _redirectTo = 'redirectTo'
|
||||||
|
|
||||||
:marked
|
:marked
|
||||||
# Routing Around the App
|
|
||||||
|
|
||||||
We received new requirements for our Tour of Heroes application:
|
We received new requirements for our Tour of Heroes application:
|
||||||
|
|
||||||
* Add a *Dashboard* view.
|
* Add a *Dashboard* view.
|
||||||
|
|
|
@ -12,8 +12,6 @@ block includes
|
||||||
- var _promise = _Promise.toLowerCase()
|
- var _promise = _Promise.toLowerCase()
|
||||||
|
|
||||||
:marked
|
:marked
|
||||||
# Getting and Saving Data
|
|
||||||
|
|
||||||
Our stakeholders appreciate our progress.
|
Our stakeholders appreciate our progress.
|
||||||
Now they want to get the hero data from a server, let users add, edit, and delete heroes,
|
Now they want to get the hero data from a server, let users add, edit, and delete heroes,
|
||||||
and save these changes back to the server.
|
and save these changes back to the server.
|
||||||
|
@ -155,7 +153,7 @@ block get-heroes-details
|
||||||
*Observables* are a powerful way to manage asynchronous data flows.
|
*Observables* are a powerful way to manage asynchronous data flows.
|
||||||
We'll learn about [Observables](#observables) later in this chapter.
|
We'll learn about [Observables](#observables) later in this chapter.
|
||||||
|
|
||||||
For *now* we get back on familiar ground by immediately by
|
For *now* we get back on familiar ground by immediately
|
||||||
converting that `Observable` to a `Promise` using the `toPromise` operator.
|
converting that `Observable` to a `Promise` using the `toPromise` operator.
|
||||||
|
|
||||||
+makeExcerpt('app/hero.service.ts', 'to-promise', '')
|
+makeExcerpt('app/hero.service.ts', 'to-promise', '')
|
||||||
|
@ -219,7 +217,7 @@ block get-heroes-details
|
||||||
Although we made significant *internal* changes to `getHeroes()`, the public signature did not change.
|
Although we made significant *internal* changes to `getHeroes()`, the public signature did not change.
|
||||||
We still return a !{_Promise}. We won't have to update any of the components that call `getHeroes()`.
|
We still return a !{_Promise}. We won't have to update any of the components that call `getHeroes()`.
|
||||||
|
|
||||||
Our stakeholders are thrilled with the added flexibility from the API integration.
|
Our stakeholders are thrilled with the added flexibility from the API integration.
|
||||||
Now they want the ability to create and delete heroes.
|
Now they want the ability to create and delete heroes.
|
||||||
|
|
||||||
Let's see first what happens when we try to update a hero's details.
|
Let's see first what happens when we try to update a hero's details.
|
||||||
|
@ -229,7 +227,7 @@ block get-heroes-details
|
||||||
## Update hero details
|
## Update hero details
|
||||||
|
|
||||||
We can edit a hero's name already in the hero detail view. Go ahead and try
|
We can edit a hero's name already in the hero detail view. Go ahead and try
|
||||||
it. As we type, the hero name is updated in the view heading.
|
it. As we type, the hero name is updated in the view heading.
|
||||||
But when we hit the `Back` button, the changes are lost!
|
But when we hit the `Back` button, the changes are lost!
|
||||||
|
|
||||||
.l-sub-section
|
.l-sub-section
|
||||||
|
@ -294,7 +292,11 @@ block get-heroes-details
|
||||||
When the given name is non-blank, the handler delegates creation of the
|
When the given name is non-blank, the handler delegates creation of the
|
||||||
named hero to the hero service, and then adds the new hero to our !{_array}.
|
named hero to the hero service, and then adds the new hero to our !{_array}.
|
||||||
|
|
||||||
Go ahead, refresh the browser and create some new heroes!
|
Finally, we implement the `create` method in the `HeroService` class.
|
||||||
|
+makeExcerpt('app/hero.service.ts', 'create')
|
||||||
|
|
||||||
|
:marked
|
||||||
|
Refresh the browser and create some new heroes!
|
||||||
|
|
||||||
.l-main-section
|
.l-main-section
|
||||||
:marked
|
:marked
|
||||||
|
@ -344,6 +346,7 @@ block get-heroes-details
|
||||||
:marked
|
:marked
|
||||||
Refresh the browser and try the new delete functionality.
|
Refresh the browser and try the new delete functionality.
|
||||||
|
|
||||||
|
#observables
|
||||||
:marked
|
:marked
|
||||||
## !{_Observable}s
|
## !{_Observable}s
|
||||||
|
|
||||||
|
@ -510,7 +513,7 @@ block observable-transformers
|
||||||
- var _declarations = _docsFor == 'dart' ? 'directives' : 'declarations'
|
- var _declarations = _docsFor == 'dart' ? 'directives' : 'declarations'
|
||||||
- var declFile = _docsFor == 'dart' ? 'app/dashboard.component.ts' : 'app/app.module.ts'
|
- var declFile = _docsFor == 'dart' ? 'app/dashboard.component.ts' : 'app/app.module.ts'
|
||||||
:marked
|
:marked
|
||||||
Finally, we import `HeroSearchComponent` from
|
Finally, we import `HeroSearchComponent` from
|
||||||
<span ngio-ex>hero-search.component.ts</span>
|
<span ngio-ex>hero-search.component.ts</span>
|
||||||
and add it to the `!{_declarations}` !{_array}:
|
and add it to the `!{_declarations}` !{_array}:
|
||||||
|
|
||||||
|
@ -532,7 +535,7 @@ figure.image-display
|
||||||
|
|
||||||
block filetree
|
block filetree
|
||||||
.filetree
|
.filetree
|
||||||
.file angular2-tour-of-heroes
|
.file angular-tour-of-heroes
|
||||||
.children
|
.children
|
||||||
.file app
|
.file app
|
||||||
.children
|
.children
|
||||||
|
@ -577,7 +580,7 @@ block filetree
|
||||||
- We configured an in-memory web API.
|
- We configured an in-memory web API.
|
||||||
- We learned how to use !{_Observable}s.
|
- We learned how to use !{_Observable}s.
|
||||||
|
|
||||||
Here are the files we added or changed in this chapter.
|
Here are the files we _added or changed_ in this chapter.
|
||||||
|
|
||||||
block file-summary
|
block file-summary
|
||||||
+makeTabs(
|
+makeTabs(
|
||||||
|
|
Loading…
Reference in New Issue