feat(core): upgrade rxjs to 6.0.0-alpha.4 (#22573)

PR Close #22573
This commit is contained in:
Igor Minar 2018-02-27 17:06:06 -05:00
parent c445314239
commit b43f8bc7d3
270 changed files with 10104 additions and 1860 deletions

View File

@ -2,7 +2,7 @@
import { Component, Input, OnDestroy } from '@angular/core';
import { MissionService } from './mission.service';
import { Subscription } from 'rxjs/Subscription';
import { Subscription } from 'rxjs';
@Component({
selector: 'app-astronaut',

View File

@ -1,6 +1,6 @@
// #docregion
import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';
import { Subject } from 'rxjs';
@Injectable()
export class MissionService {

View File

@ -1,6 +1,6 @@
// #docregion
import { Component } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { Hero, HeroTaxReturn } from './hero';
import { HeroesService } from './heroes.service';

View File

@ -1,7 +1,6 @@
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observer } from 'rxjs/Observer';
import { Observable, Observer } from 'rxjs';
import { Hero, HeroTaxReturn } from './hero';

View File

@ -1,6 +1,6 @@
// #docregion
import { Component } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { Villain, VillainsService } from './villains.service';

View File

@ -1,6 +1,6 @@
import { Injectable } from '@angular/core';
import { of } from 'rxjs/observable/of';
import { of } from 'rxjs';
export interface Villain { id: number; name: string; }

View File

@ -30,7 +30,7 @@ export class ConfigComponent {
this.configService.getConfig()
// #enddocregion v1, v2
.subscribe(
data => this.config = { ...data }, // success path
(data: Config) => this.config = { ...data }, // success path
error => this.error = error // error path
);
}
@ -39,7 +39,7 @@ export class ConfigComponent {
showConfig_v1() {
this.configService.getConfig_1()
// #docregion v1, v1_callback
.subscribe(data => this.config = {
.subscribe((data: Config) => this.config = {
heroesUrl: data['heroesUrl'],
textfile: data['textfile']
});
@ -51,7 +51,7 @@ export class ConfigComponent {
this.configService.getConfig()
// #docregion v2, v2_callback
// clone the data object, using its known Config shape
.subscribe(data => this.config = { ...data });
.subscribe((data: Config) => this.config = { ...data });
// #enddocregion v2_callback
}
// #enddocregion v2

View File

@ -6,8 +6,7 @@ import { HttpClient } from '@angular/common/http';
import { HttpErrorResponse, HttpResponse } from '@angular/common/http';
// #docregion rxjs-imports
import { Observable } from 'rxjs/Observable';
import { ErrorObservable } from 'rxjs/observable/ErrorObservable';
import { Observable, throwError } from 'rxjs';
import { catchError, retry } from 'rxjs/operators';
// #enddocregion rxjs-imports
@ -82,8 +81,8 @@ export class ConfigService {
`Backend returned code ${error.status}, ` +
`body was: ${error.error}`);
}
// return an ErrorObservable with a user-facing error message
return new ErrorObservable(
// return an observable with a user-facing error message
return throwError(
'Something bad happened; please try again later.');
};
// #enddocregion handleError

View File

@ -6,8 +6,7 @@ import { HttpHeaders } from '@angular/common/http';
// #enddocregion http-options
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { Observable } from 'rxjs';
import { catchError } from 'rxjs/operators';
import { Hero } from './hero';

View File

@ -1,8 +1,7 @@
import { Injectable } from '@angular/core';
import { HttpErrorResponse } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { Observable, of } from 'rxjs';
import { MessageService } from './message.service';

View File

@ -4,8 +4,6 @@ import {
HttpEvent, HttpInterceptor, HttpHandler, HttpRequest
} from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
// #docregion
import { AuthService } from '../auth.service';

View File

@ -5,8 +5,7 @@ import {
HttpInterceptor, HttpHandler
} from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { Observable, of } from 'rxjs';
import { startWith, tap } from 'rxjs/operators';
import { RequestCache } from '../request-cache.service';

View File

@ -3,7 +3,7 @@ import {
HttpEvent, HttpInterceptor, HttpHandler, HttpRequest
} from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
@Injectable()
export class EnsureHttpsInterceptor implements HttpInterceptor {

View File

@ -4,7 +4,6 @@ import {
HttpRequest, HttpResponse
} from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
// #docregion excerpt
import { finalize, tap } from 'rxjs/operators';
import { MessageService } from '../message.service';

View File

@ -3,7 +3,7 @@ import {
HttpEvent, HttpInterceptor, HttpHandler, HttpRequest
} from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
/** Pass untouched request through to the next request handler. */
@Injectable()

View File

@ -3,7 +3,7 @@ import {
HttpEvent, HttpInterceptor, HttpHandler, HttpRequest
} from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
@Injectable()
export class TrimNameInterceptor implements HttpInterceptor {

View File

@ -5,8 +5,7 @@ import {
HttpEventType, HttpProgressEvent
} from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { Observable } from 'rxjs';
/** Simulate server replying to file upload request */
@Injectable()

View File

@ -1,7 +1,6 @@
import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Subject } from 'rxjs/Subject';
import { Observable, Subject } from 'rxjs';
import { debounceTime, distinctUntilChanged, switchMap } from 'rxjs/operators';
import { NpmPackageInfo, PackageSearchService } from './package-search.service';

View File

@ -1,8 +1,7 @@
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { Observable, of } from 'rxjs';
import { catchError, map } from 'rxjs/operators';
import { HttpErrorHandler, HandleError } from '../http-error-handler.service';

View File

@ -4,7 +4,7 @@ import {
HttpRequest, HttpResponse, HttpErrorResponse
} from '@angular/common/http';
import { of } from 'rxjs/observable/of';
import { of } from 'rxjs';
import { catchError, last, map, tap } from 'rxjs/operators';
import { MessageService } from '../message.service';

View File

@ -2,8 +2,7 @@
// #docregion
import { Injectable, OnDestroy } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { Observable, of } from 'rxjs';
import { delay } from 'rxjs/operators';
export class Contact {

View File

@ -1,5 +1,5 @@
import { Component } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { Crisis,
CrisisService } from './crisis.service';

View File

@ -1,7 +1,6 @@
import { Injectable, OnDestroy } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { Observable, of } from 'rxjs';
import { delay } from 'rxjs/operators';
export class Crisis {

View File

@ -1,5 +1,5 @@
import { Component } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { Hero,
HeroService } from './hero.service';

View File

@ -1,7 +1,6 @@
import { Injectable, OnDestroy } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { Observable, of } from 'rxjs';
import { delay } from 'rxjs/operators';
export class Hero {

View File

@ -1,8 +1,7 @@
import { Injectable, OnDestroy } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { delay } from 'rxjs/operator/delay';
import { Observable, of } from 'rxjs';
import { delay } from 'rxjs/operators';
export class Contact {
constructor(public id: number, public name: string) { }
@ -24,12 +23,12 @@ export class ContactService implements OnDestroy {
ngOnDestroy() { console.log('ContactService instance destroyed.'); }
getContacts(): Observable<Contact[]> {
return delay.call(of(CONTACTS), FETCH_LATENCY);
return of(CONTACTS).pipe(delay(FETCH_LATENCY));
}
getContact(id: number | string): Observable<Contact> {
const contact$ = of(CONTACTS.find(contact => contact.id === +id));
return delay.call(contact$, FETCH_LATENCY);
return contact$.pipe(delay(FETCH_LATENCY));
}
}

View File

@ -1,5 +1,5 @@
import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { Customer,
CustomersService } from './customers.service';

View File

@ -1,8 +1,7 @@
import { Injectable, OnDestroy } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { delay } from 'rxjs/operator/delay';
import { Observable, of } from 'rxjs';
import { delay } from 'rxjs/operators';
export class Customer {
constructor(public id: number, public name: string) { }
@ -27,11 +26,11 @@ export class CustomersService implements OnDestroy {
ngOnDestroy() { console.log('CustomersService instance destroyed.'); }
getCustomers(): Observable<Customer[]> {
return delay.call(of(CUSTOMERS), FETCH_LATENCY);
return of(CUSTOMERS).pipe(delay(FETCH_LATENCY));
}
getCustomer(id: number | string): Observable<Customer> {
const customer$ = of(CUSTOMERS.find(customer => customer.id === +id));
return delay.call(customer$, FETCH_LATENCY);
return customer$.pipe(delay(FETCH_LATENCY));
}
}

View File

@ -1,5 +1,5 @@
import { Component, OnInit } from '@angular/core';
import { Observable }from 'rxjs/Observable';
import { Observable }from 'rxjs';
import { Item,
ItemService } from './items.service';

View File

@ -1,6 +1,7 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ItemsComponent } from './items.component';
import { ItemsListComponent } from './items-list.component';
import { ItemsDetailComponent } from './items-detail.component';
import { ItemService } from './items.service';
@ -8,7 +9,7 @@ import { ItemsRoutingModule } from './items-routing.module';
@NgModule({
imports: [ CommonModule, ItemsRoutingModule ],
declarations: [ ItemsDetailComponent, ItemsListComponent ],
declarations: [ ItemsComponent, ItemsDetailComponent, ItemsListComponent ],
providers: [ ItemService ]
})
export class ItemsModule {}

View File

@ -1,8 +1,7 @@
import { Injectable, OnDestroy } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { delay } from 'rxjs/operator/delay';
import { Observable, of } from 'rxjs';
import { delay } from 'rxjs/operators';
export class Item {
constructor(public id: number, public name: string) { }
@ -25,12 +24,12 @@ export class ItemService implements OnDestroy {
ngOnDestroy() { console.log('ItemService instance destroyed.'); }
getItems(): Observable<Item[]> {
return delay.call(of(ITEMS), FETCH_LATENCY);
return of(ITEMS).pipe(delay(FETCH_LATENCY));
}
getItem(id: number | string): Observable<Item> {
const item$ = of(ITEMS.find(item => item.id === +id));
return delay.call(item$, FETCH_LATENCY);
return item$.pipe(delay(FETCH_LATENCY));
}
}

View File

@ -1,6 +1,6 @@
import { Component, Output, OnInit, EventEmitter, NgModule } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
// #docregion eventemitter

View File

@ -1,5 +1,5 @@
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
// #docregion subscriber

View File

@ -1,4 +1,4 @@
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
// #docregion

View File

@ -1,5 +1,5 @@
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
// #docregion delay_sequence

View File

@ -1,6 +1,5 @@
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import { Observable, of } from 'rxjs';
// #docregion observer

View File

@ -2,7 +2,7 @@
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { HttpClientModule } from '@angular//common/http';
import { AppComponent } from './app.component';
import {
@ -26,7 +26,7 @@ import { ExponentialStrengthPipe } from './exponential-strength.pipe';
imports: [
BrowserModule,
FormsModule,
HttpModule
HttpClientModule
],
declarations: [
AppComponent,

View File

@ -1,9 +1,6 @@
// #docregion
import { Pipe, PipeTransform } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
import { HttpClient } from '@angular/common/http';
// #docregion pipe-metadata
@Pipe({
name: 'fetch',
@ -14,15 +11,13 @@ export class FetchJsonPipe implements PipeTransform {
private cachedData: any = null;
private cachedUrl = '';
constructor(private http: Http) { }
constructor(private http: HttpClient) { }
transform(url: string): any {
if (url !== this.cachedUrl) {
this.cachedData = null;
this.cachedUrl = url;
this.http.get(url)
.map( result => result.json() )
.subscribe( result => this.cachedData = result );
this.http.get(url).subscribe( result => this.cachedData = result );
}
return this.cachedData;

View File

@ -1,10 +1,8 @@
// #docregion
import { Component } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/interval';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/take';
import { Observable, interval } from 'rxjs';
import { map, take } from 'rxjs/operators';
@Component({
selector: 'app-hero-message',
@ -25,14 +23,17 @@ export class HeroAsyncMessageComponent {
constructor() { this.resend(); }
resend() {
this.message$ = Observable.interval(500)
.map(i => this.messages[i])
.take(this.messages.length);
this.message$ = interval(500).pipe(
map(i => this.messages[i]),
take(this.messages.length)
);
}
}
// #enddocregion
// Alternative message$ formula:
// this.message$ = Observable.fromArray(this.messages)
// .map(message => Observable.timer(500).map(() => message))
// .concatAll();
// this.message$ = fromArray(this.messages).pipe(
// map(message => timer(500),
// map(() => message)),
// concatAll()
// );

View File

@ -1,9 +1,7 @@
import { ajax } from 'rxjs/observable/dom/ajax';
import { range } from 'rxjs/observable/range';
import { timer } from 'rxjs/observable/timer';
import { pipe } from 'rxjs/util/pipe';
import { retryWhen, zip, map, mergeMap } from 'rxjs/operators';
import { pipe, range, timer, zip } from 'rxjs';
import { ajax } from 'rxjs/ajax';
import { retryWhen, map, mergeMap } from 'rxjs/operators';
function backoff(maxTries, ms) {
return pipe(

View File

@ -1,6 +1,6 @@
import { fromEvent } from 'rxjs/observable/fromEvent';
import { ajax } from 'rxjs/observable/dom/ajax';
import { fromEvent } from 'rxjs';
import { ajax } from 'rxjs/ajax';
import { map, filter, debounceTime, distinctUntilChanged, switchMap } from 'rxjs/operators';
const searchBox = document.getElementById('search-box');

View File

@ -1,6 +1,7 @@
/* tslint:disable:member-ordering */
import { Component } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { finalize } from 'rxjs/operators';
import { Hero } from './data-model';
import { HeroService } from './hero.service';
@ -33,8 +34,9 @@ export class DemoComponent {
getHeroes() {
this.isLoading = true;
this.heroes = this.heroService.getHeroes()
.finally(() => this.isLoading = false);
this.heroes = this.heroService.getHeroes().pipe(
finalize(() => this.isLoading = false)
);
this.selectedHero = undefined;
}

View File

@ -1,7 +1,7 @@
// #docregion
import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/finally';
import { Observable } from 'rxjs';
import { finalize } from 'rxjs/operators';
import { Hero } from '../data-model';
import { HeroService } from '../hero.service';
@ -24,7 +24,7 @@ export class HeroListComponent implements OnInit {
this.isLoading = true;
this.heroes = this.heroService.getHeroes()
// Todo: error handling
.finally(() => this.isLoading = false);
.pipe(finalize(() => this.isLoading = false));
this.selectedHero = undefined;
}

View File

@ -1,9 +1,8 @@
// #docregion
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import 'rxjs/add/operator/delay';
import { Observable, of } from 'rxjs';
import { delay } from 'rxjs/operators';
import { Hero, heroes } from './data-model';
@ -14,13 +13,13 @@ export class HeroService {
// Fake server get; assume nothing can go wrong
getHeroes(): Observable<Hero[]> {
return of(heroes).delay(this.delayMs); // simulate latency with delay
return of(heroes).pipe(delay(this.delayMs)); // simulate latency with delay
}
// Fake server update; assume nothing can go wrong
updateHero(hero: Hero): Observable<Hero> {
const oldHero = heroes.find(h => h.id === hero.id);
const newHero = Object.assign(oldHero, hero); // Demo: mutate cached hero
return of(newHero).delay(this.delayMs); // simulate latency with delay
return of(newHero).pipe(delay(this.delayMs)); // simulate latency with delay
}
}

View File

@ -1,8 +1,8 @@
// #docregion
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
@Component({
template: `
@ -23,11 +23,11 @@ export class AdminDashboardComponent implements OnInit {
// Capture the session ID if available
this.sessionId = this.route
.queryParamMap
.map(params => params.get('session_id') || 'None');
.pipe(map(params => params.get('session_id') || 'None'));
// Capture the fragment if available
this.token = this.route
.fragment
.map(fragment => fragment || 'None');
.pipe(map(fragment => fragment || 'None'));
}
}

View File

@ -1,11 +1,11 @@
// #docregion
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import { SelectivePreloadingStrategy } from '../selective-preloading-strategy';
import 'rxjs/add/operator/map';
@Component({
template: `
@ -37,11 +37,11 @@ export class AdminDashboardComponent implements OnInit {
// Capture the session ID if available
this.sessionId = this.route
.queryParamMap
.map(params => params.get('session_id') || 'None');
.pipe(map(params => params.get('session_id') || 'None'));
// Capture the fragment if available
this.token = this.route
.fragment
.map(fragment => fragment || 'None');
.pipe(map(fragment => fragment || 'None'));
}
}

View File

@ -1,10 +1,8 @@
// #docregion
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import 'rxjs/add/operator/do';
import 'rxjs/add/operator/delay';
import { Observable, of } from 'rxjs';
import { tap, delay } from 'rxjs/operators';
@Injectable()
export class AuthService {
@ -14,7 +12,10 @@ export class AuthService {
redirectUrl: string;
login(): Observable<boolean> {
return Observable.of(true).delay(1000).do(val => this.isLoggedIn = true);
return of(true).pipe(
delay(1000),
tap(val => this.isLoggedIn = true)
);
}
logout(): void {

View File

@ -1,6 +1,6 @@
// #docregion
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { CanDeactivate,
ActivatedRouteSnapshot,
RouterStateSnapshot } from '@angular/router';

View File

@ -1,7 +1,7 @@
// #docregion
import { Injectable } from '@angular/core';
import { CanDeactivate } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
export interface CanComponentDeactivate {
canDeactivate: () => Observable<boolean> | Promise<boolean> | boolean;

View File

@ -1,10 +1,9 @@
// #docregion
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/take';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Router, Resolve, RouterStateSnapshot,
ActivatedRouteSnapshot } from '@angular/router';
import { Observable } from 'rxjs';
import { map, take } from 'rxjs/operators';
import { Crisis, CrisisService } from './crisis.service';
@ -15,13 +14,16 @@ export class CrisisDetailResolver implements Resolve<Crisis> {
resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Crisis> {
let id = route.paramMap.get('id');
return this.cs.getCrisis(id).take(1).map(crisis => {
return this.cs.getCrisis(id).pipe(
take(1),
map(crisis => {
if (crisis) {
return crisis;
} else { // id not found
this.router.navigate(['/crisis-center']);
return null;
}
});
})
);
}
}

View File

@ -1,9 +1,9 @@
// #docplaster
// #docregion
import 'rxjs/add/operator/switchMap';
import { Component, OnInit, HostBinding } from '@angular/core';
import { ActivatedRoute, Router, ParamMap } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { switchMap } from 'rxjs/operators';
import { slideInDownAnimation } from '../animations';
import { Crisis, CrisisService } from './crisis.service';
@ -46,8 +46,9 @@ export class CrisisDetailComponent implements OnInit {
// #docregion ngOnInit
ngOnInit() {
this.route.paramMap
.switchMap((params: ParamMap) =>
this.service.getCrisis(params.get('id')))
.pipe(
switchMap((params: ParamMap) =>
this.service.getCrisis(params.get('id'))))
.subscribe((crisis: Crisis) => {
if (crisis) {
this.editName = crisis.name;

View File

@ -2,7 +2,7 @@
// #docregion
import { Component, OnInit, HostBinding } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { slideInDownAnimation } from '../animations';
import { Crisis } from './crisis.service';

View File

@ -1,10 +1,10 @@
import 'rxjs/add/operator/switchMap';
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, ParamMap } from '@angular/router';
import { Crisis, CrisisService } from './crisis.service';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { switchMap } from 'rxjs/operators';
@Component({
// #docregion relative-navigation-router-link
@ -34,10 +34,11 @@ export class CrisisListComponent implements OnInit {
ngOnInit() {
this.crises$ = this.route.paramMap
.switchMap((params: ParamMap) => {
this.crises$ = this.route.paramMap.pipe(
switchMap((params: ParamMap) => {
this.selectedId = +params.get('id');
return this.service.getCrises();
});
})
);
}
}

View File

@ -1,10 +1,10 @@
// #docregion
import 'rxjs/add/operator/switchMap';
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, ParamMap } from '@angular/router';
import { Crisis, CrisisService } from './crisis.service';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { switchMap } from 'rxjs/operators';
@Component({
template: `
@ -32,10 +32,11 @@ export class CrisisListComponent implements OnInit {
// #enddocregion ctor
ngOnInit() {
this.crises$ = this.route.paramMap
.switchMap((params: ParamMap) => {
this.crises$ = this.route.paramMap.pipe(
switchMap((params: ParamMap) => {
this.selectedId = +params.get('id');
return this.service.getCrises();
});
})
);
}
}

View File

@ -1,8 +1,7 @@
// #docplaster
// #docregion , mock-crises
import 'rxjs/add/observable/of';
import 'rxjs/add/operator/map';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
import { BehaviorSubject } from 'rxjs';
import { map } from 'rxjs/operators';
export class Crisis {
constructor(public id: number, public name: string) { }
@ -26,8 +25,9 @@ export class CrisisService {
getCrises() { return this.crises$; }
getCrisis(id: number | string) {
return this.getCrises()
.map(crises => crises.find(crisis => crisis.id === +id));
return this.getCrises().pipe(
map(crises => crises.find(crisis => crisis.id === +id))
);
}
// #enddocregion

View File

@ -1,7 +1,6 @@
// #docregion
import 'rxjs/add/observable/of';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable, of } from 'rxjs';
/**
* Async modal dialog service
@ -17,6 +16,6 @@ export class DialogService {
confirm(message?: string): Observable<boolean> {
const confirmation = window.confirm(message || 'Is it OK?');
return Observable.of(confirmation);
return of(confirmation);
};
}

View File

@ -1,10 +1,10 @@
// #docplaster
// #docregion
// #docregion rxjs-operator-import
import 'rxjs/add/operator/switchMap';
import { switchMap } from 'rxjs/operators';
// #enddocregion rxjs-operator-import
import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
// #docregion imports
import { Router, ActivatedRoute, ParamMap } from '@angular/router';
// #enddocregion imports
@ -41,9 +41,10 @@ export class HeroDetailComponent implements OnInit {
// #docregion ngOnInit
ngOnInit() {
this.hero$ = this.route.paramMap
.switchMap((params: ParamMap) =>
this.service.getHero(params.get('id')));
this.hero$ = this.route.paramMap.pipe(
switchMap((params: ParamMap) =>
this.service.getHero(params.get('id')))
);
}
// #enddocregion ngOnInit

View File

@ -2,7 +2,7 @@
// #docregion
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { Hero, HeroService } from './hero.service';

View File

@ -1,11 +1,11 @@
// #docplaster
// #docregion
// #docregion rxjs-operator-import
import 'rxjs/add/operator/switchMap';
import { switchMap } from 'rxjs/operators';
// #enddocregion rxjs-operator-import
import { Component, OnInit, HostBinding } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Router, ActivatedRoute, ParamMap } from '@angular/router';
import { Observable } from 'rxjs';
import { slideInDownAnimation } from '../animations';
@ -48,9 +48,10 @@ export class HeroDetailComponent implements OnInit {
// #docregion ngOnInit
ngOnInit() {
this.hero$ = this.route.paramMap
.switchMap((params: ParamMap) =>
this.service.getHero(params.get('id')));
this.hero$ = this.route.paramMap.pipe(
switchMap((params: ParamMap) =>
this.service.getHero(params.get('id')))
);
}
// #enddocregion ngOnInit

View File

@ -3,7 +3,7 @@
// TODO SOMEDAY: Feature Componetized like HeroCenter
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { Hero, HeroService } from './hero.service';

View File

@ -2,8 +2,8 @@
// #docregion
// TODO SOMEDAY: Feature Componetized like CrisisCenter
// #docregion rxjs-imports
import 'rxjs/add/operator/switchMap';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { switchMap } from 'rxjs/operators';
// #enddocregion rxjs-imports
import { Component, OnInit } from '@angular/core';
// #docregion import-router
@ -41,12 +41,13 @@ export class HeroListComponent implements OnInit {
) {}
ngOnInit() {
this.heroes$ = this.route.paramMap
.switchMap((params: ParamMap) => {
this.heroes$ = this.route.paramMap.pipe(
switchMap((params: ParamMap) => {
// (+) before `params.get()` turns the string into a number
this.selectedId = +params.get('id');
return this.service.getHeroes();
});
})
);
}
// #enddocregion ctor
// #docregion ctor

View File

@ -1,8 +1,7 @@
// #docregion
import 'rxjs/add/observable/of';
import 'rxjs/add/operator/map';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs';
import { map } from 'rxjs/operators';
export class Hero {
constructor(public id: number, public name: string) { }
@ -19,11 +18,12 @@ const HEROES = [
@Injectable()
export class HeroService {
getHeroes() { return Observable.of(HEROES); }
getHeroes() { return of(HEROES); }
getHero(id: number | string) {
return this.getHeroes()
return this.getHeroes().pipe(
// (+) before `id` turns the string into a number
.map(heroes => heroes.find(hero => hero.id === +id));
map(heroes => heroes.find(hero => hero.id === +id))
);
}
}

View File

@ -1,8 +1,7 @@
// #docregion
import 'rxjs/add/observable/of';
import { Injectable } from '@angular/core';
import { PreloadingStrategy, Route } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { Observable, of } from 'rxjs';
@Injectable()
export class SelectivePreloadingStrategy implements PreloadingStrategy {
@ -18,7 +17,7 @@ export class SelectivePreloadingStrategy implements PreloadingStrategy {
return load();
} else {
return Observable.of(null);
return of(null);
}
}
}

View File

@ -1,10 +1,9 @@
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import { of } from 'rxjs';
// #docregion
import { ajax } from 'rxjs/observable/dom/ajax';
import { ajax } from 'rxjs/ajax';
import { map, catchError } from 'rxjs/operators';
// Return "response" from the API. If an error happens,
// return an empty array.
@ -15,7 +14,7 @@ const apiData = ajax('/api/data').pipe(
}
return res.response;
}),
catchError(err => Observable.of([]))
catchError(err => of([]))
);
apiData.subscribe({

View File

@ -1,7 +1,7 @@
import { Component } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
@Component({
selector: 'app-stopwatch',

View File

@ -1,12 +1,10 @@
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import { of, pipe } from 'rxjs';
// #docregion
import { pipe } from 'rxjs/util/pipe';
import { filter, map } from 'rxjs/operators';
const nums = Observable.of(1, 2, 3, 4, 5);
const nums = of(1, 2, 3, 4, 5);
// Create a function that accepts an Observable.
const squareOddVals = pipe(

View File

@ -1,12 +1,10 @@
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import { Observable, of } from 'rxjs';
// #docregion
import { filter } from 'rxjs/operators/filter';
import { map } from 'rxjs/operators/map';
import { filter, map } from 'rxjs/operators';
const squareOdd = Observable.of(1, 2, 3, 4, 5)
const squareOdd = of(1, 2, 3, 4, 5)
.pipe(
filter(n => n % 2),
map(n => n * n)

View File

@ -1,12 +1,11 @@
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import { Observable, of } from 'rxjs';
// #docregion
import { map } from 'rxjs/operators';
const nums = Observable.of(1, 2, 3);
const nums = of(1, 2, 3);
const squareValues = map((val: number) => val * val);
const squaredNums = squareValues(nums);

View File

@ -1,11 +1,10 @@
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import { Observable, of } from 'rxjs';
// #docregion
import { ajax } from 'rxjs/observable/dom/ajax';
import { ajax } from 'rxjs/ajax';
import { map, retry, catchError } from 'rxjs/operators';
const apiData = ajax('/api/data').pipe(
@ -16,7 +15,7 @@ const apiData = ajax('/api/data').pipe(
}
return res.response;
}),
catchError(err => Observable.of([]))
catchError(err => of([]))
);
apiData.subscribe({

View File

@ -1,7 +1,7 @@
// #docregion promise
import { fromPromise } from 'rxjs/observable/fromPromise';
import { fromPromise } from 'rxjs';
// Create an Observable out of a promise
const data = fromPromise(fetch('/api/endpoint'));
@ -16,7 +16,7 @@ data.subscribe({
// #docregion interval
import { interval } from 'rxjs/observable/interval';
import { interval } from 'rxjs';
// Create an Observable that will publish a value on an interval
const secondsCounter = interval(1000);
@ -29,7 +29,7 @@ secondsCounter.subscribe(n =>
// #docregion event
import { fromEvent } from 'rxjs/observable/fromEvent';
import { fromEvent } from 'rxjs';
const el = document.getElementById('my-element');
@ -53,7 +53,7 @@ const subscription = mouseMoves.subscribe((evt: MouseEvent) => {
// #docregion ajax
import { ajax } from 'rxjs/observable/dom/ajax';
import { ajax } from 'rxjs/ajax';
// Create an Observable that will create an AJAX request
const apiData = ajax('/api/data');

View File

@ -3,7 +3,7 @@ import { SwUpdate } from '@angular/service-worker';
// #docregion sw-check-update
import { interval } from 'rxjs/observable/interval';
import { interval } from 'rxjs';
@Injectable()
export class CheckForUpdateService {

View File

@ -5,6 +5,7 @@
import { ExceptionService, SpinnerService, ToastService } from '../../core';
import { Http } from '@angular/http';
import { Injectable } from '@angular/core';
import { map } from 'rxjs/operators';
import { Hero } from './hero.model';
// #enddocregion example
@ -19,13 +20,13 @@ export class HeroService {
) { }
getHero(id: number) {
return this.http.get(`api/heroes/${id}`)
.map(response => response.json().data as Hero);
return this.http.get(`api/heroes/${id}`).pipe(
map(response => response.json().data as Hero));
}
getHeroes() {
return this.http.get(`api/heroes`)
.map(response => response.json().data as Hero[]);
return this.http.get(`api/heroes`).pipe(
map(response => response.json().data as Hero[]));
}
}

View File

@ -2,6 +2,7 @@
// #docregion example
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { map } from 'rxjs/operators';
import { Hero } from './hero.model';
import { ExceptionService, SpinnerService, ToastService } from '../../core';
@ -19,13 +20,13 @@ export class HeroService {
) { }
getHero(id: number) {
return this.http.get(`api/heroes/${id}`)
.map(response => response.json() as Hero);
return this.http.get(`api/heroes/${id}`).pipe(
map(response => response.json() as Hero));
}
getHeroes() {
return this.http.get(`api/heroes`)
.map(response => response.json() as Hero[]);
return this.http.get(`api/heroes`).pipe(
map(response => response.json() as Hero[]));
}
}

View File

@ -1,6 +1,6 @@
// #docregion
import { Component, OnDestroy, OnInit } from '@angular/core';
import { Subscription } from 'rxjs/Subscription';
import { Subscription } from 'rxjs';
import { LoggerService } from '../logger.service';
import { SpinnerState, SpinnerService } from './spinner.service';

View File

@ -1,6 +1,6 @@
// #docregion
import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';
import { Subject } from 'rxjs';
export interface SpinnerState {
show: boolean;

View File

@ -1,5 +1,5 @@
import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { Hero, HeroService } from './shared';

View File

@ -1,5 +1,5 @@
import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { Hero, HeroService } from './shared';

View File

@ -1,8 +1,8 @@
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import { Hero } from './hero.model';
@ -12,7 +12,8 @@ export class HeroService {
constructor(private http: Http) {}
getHeroes(): Observable<Hero[]> {
return this.http.get('api/heroes')
.map(resp => resp.json().data as Hero[]);
return this.http.get('api/heroes').pipe(
map(resp => resp.json().data as Hero[])
);
}
}

View File

@ -4,10 +4,8 @@
import { OnInit } from '@angular/core';
import { Http, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/finally';
import 'rxjs/add/operator/map';
import { Observable } from 'rxjs';
import { catchError, finalize, map } from 'rxjs/operators';
import { Hero } from '../shared/hero.model';
@ -18,11 +16,11 @@ export class HeroListComponent implements OnInit {
constructor(private http: Http) {}
getHeroes() {
this.heroes = [];
this.http.get(heroesUrl)
.map((response: Response) => <Hero[]>response.json().data)
.catch(this.catchBadResponse)
.finally(() => this.hideSpinner())
.subscribe((heroes: Hero[]) => this.heroes = heroes);
this.http.get(heroesUrl).pipe(
map((response: Response) => <Hero[]>response.json().data),
catchError(this.catchBadResponse),
finalize(() => this.hideSpinner())
).subscribe((heroes: Hero[]) => this.heroes = heroes);
}
ngOnInit() {
this.getHeroes();

View File

@ -1,8 +1,7 @@
// #docregion
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import { of } from 'rxjs';
import { Hero } from './hero.model';
@ -10,6 +9,6 @@ import { Hero } from './hero.model';
export class HeroService {
getHeroes() {
let heroes: Hero[] = [];
return Observable.of(heroes);
return of(heroes);
}
}

View File

@ -1,6 +1,7 @@
// #docregion
import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import { map } from 'rxjs/operators';
import { Hero } from './hero.model';
@ -10,8 +11,8 @@ export class HeroService {
constructor(private http: Http) { }
getHeroes() {
return this.http.get('api/heroes')
.map((response: Response) => <Hero[]>response.json());
return this.http.get('api/heroes').pipe(
map((response: Response) => <Hero[]>response.json()));
}
}
// #enddocregion example

View File

@ -1,8 +1,7 @@
// #docregion
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import { Observable, of } from 'rxjs';
import { Hero } from './hero.model';
@ -10,6 +9,6 @@ import { Hero } from './hero.model';
export class HeroService {
getHeroes() {
let heroes: Hero[] = [];
return Observable.of(heroes);
return of(heroes);
}
}

View File

@ -1,8 +1,7 @@
// #docregion
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import { of } from 'rxjs';
import { Hero } from './hero.model';
@ -10,6 +9,6 @@ import { Hero } from './hero.model';
export class HeroService {
getHeroes() {
let heroes: Hero[] = [];
return Observable.of(heroes);
return of(heroes);
}
}

View File

@ -1,6 +1,5 @@
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import 'rxjs/add/operator/map';
platformBrowserDynamic().bootstrapModule(AppModule);

View File

@ -1,7 +1,7 @@
// tslint:disable-next-line:no-unused-variable
import { async, fakeAsync, tick } from '@angular/core/testing';
import { of } from 'rxjs/observable/of';
import { of } from 'rxjs';
import { delay } from 'rxjs/operators';
describe('Angular async helper', () => {

View File

@ -6,7 +6,7 @@ import { Component, ContentChildren, Directive, EventEmitter,
Pipe, PipeTransform,
SimpleChange } from '@angular/core';
import { of } from 'rxjs/observable/of';
import { of } from 'rxjs';
import { delay } from 'rxjs/operators';
////////// The App: Services and Components for the tests. //////////////

View File

@ -1,6 +1,6 @@
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import { Hero } from '../model/hero';

View File

@ -1,7 +1,7 @@
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { Hero } from '../model/hero';
import { HeroService } from '../model/hero.service';

View File

@ -1,8 +1,7 @@
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders, HttpErrorResponse } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { Observable } from 'rxjs';
import { catchError, map, tap } from 'rxjs/operators';
import { Hero } from './hero';

View File

@ -14,9 +14,7 @@ import {
HttpModule, Http, XHRBackend, Response, ResponseOptions
} from '@angular/http';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { catchError, tap } from 'rxjs/operators';
import { of } from 'rxjs';
import { Hero } from './hero';
import { HttpHeroService } from './http-hero.service';

View File

@ -6,9 +6,9 @@ import { Http, Response } from '@angular/http';
import { Headers, RequestOptions } from '@angular/http';
import { Hero } from './hero';
import { Observable } from 'rxjs/Observable';
import { ErrorObservable } from 'rxjs/observable/ErrorObservable';
import { catchError, map, tap } from 'rxjs/operators';
import { Observable } from 'rxjs';
import { throwError } from 'rxjs';
import { catchError, map } from 'rxjs/operators';
@Injectable()
export class HttpHeroService {
@ -64,6 +64,6 @@ export class HttpHeroService {
// In a real world app, we might send the error to remote logging infrastructure
let errMsg = error.message || 'Server error';
console.error(errMsg); // log to console instead
return new ErrorObservable(errMsg);
return throwError(errMsg);
}
}

View File

@ -1,6 +1,6 @@
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
import { asyncData } from '../../../testing';
import { map } from 'rxjs/operators';

View File

@ -5,12 +5,6 @@ import { async, fakeAsync, ComponentFixture, TestBed, tick } from '@angular/core
import { cold, getTestScheduler } from 'jasmine-marbles';
// #enddocregion import-marbles
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { ErrorObservable } from 'rxjs/observable/ErrorObservable';
import { last } from 'rxjs/operators';
import { TwainService } from './twain.service';
import { TwainComponent } from './twain.component';

View File

@ -3,10 +3,8 @@ import { async, fakeAsync, ComponentFixture, TestBed, tick } from '@angular/core
import { asyncData, asyncError } from '../../testing';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { of, throwError } from 'rxjs';
import { ErrorObservable } from 'rxjs/observable/ErrorObservable';
import { last } from 'rxjs/operators';
import { TwainService } from './twain.service';
@ -75,7 +73,7 @@ describe('TwainComponent', () => {
it('should display error when TwainService fails', fakeAsync(() => {
// tell spy to return an error observable
getQuoteSpy.and.returnValue(
new ErrorObservable('TwainService test failure'));
throwError('TwainService test failure'));
fixture.detectChanges(); // onInit()
// sync spy errors immediately after init

View File

@ -1,8 +1,7 @@
// #docregion
import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { Observable, of } from 'rxjs';
import { catchError, startWith } from 'rxjs/operators';
import { TwainService } from './twain.service';

View File

@ -2,9 +2,7 @@
import { Injectable } from '@angular/core';
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { ErrorObservable } from 'rxjs/observable/ErrorObservable';
import { of } from 'rxjs/observable/of';
import { Observable, of, throwError } from 'rxjs';
import { concat, map, retryWhen, switchMap, take, tap } from 'rxjs/operators';
import { Quote } from './quote';
@ -35,11 +33,11 @@ export class TwainService {
}
// Some other HTTP error.
console.error(error);
return new ErrorObservable('Cannot get Twain quotes from the server');
return throwError('Cannot get Twain quotes from the server');
}),
take(2),
// If a second retry value, then didn't find id:1 and triggers the following error
concat(new ErrorObservable('There are no Twain quotes')) // didn't find id:1
concat(throwError('There are no Twain quotes')) // didn't find id:1
))
);
}

View File

@ -2,8 +2,8 @@
export { ActivatedRoute } from '@angular/router';
// #docregion activated-route-stub
import { ReplaySubject } from 'rxjs/ReplaySubject';
import { convertToParamMap, ParamMap, Params } from '@angular/router';
import { ReplaySubject } from 'rxjs';
/**
* An ActivateRoute test double with a `paramMap` observable.

View File

@ -10,8 +10,7 @@
*
* Using `asap` scheduler - as in `of(value, asap)` - doesn't work either.
*/
import { Observable } from 'rxjs/Observable';
import { defer } from 'rxjs/observable/defer';
import { defer } from 'rxjs';
// #docregion async-data
/** Create async observable that emits-once and completes

View File

@ -3,8 +3,7 @@
import { Injectable } from '@angular/core';
// #docregion import-observable
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { Observable, of } from 'rxjs';
// #enddocregion import-observable
// #docregion import-heroes

View File

@ -1,6 +1,6 @@
import { Hero } from '../hero';
import { HeroService } from '../hero.service';
import { Observable } from 'rxjs/Observable';
import { Observable } from 'rxjs';
class DummyHeroesComponent {

Some files were not shown because too many files have changed in this diff Show More