Skip to content
This repository was archived by the owner on Dec 4, 2017. It is now read-only.

docs(http): use a class for default RequestOptions override #2982

Merged
merged 1 commit into from
Dec 15, 2016
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 7 additions & 11 deletions public/docs/_examples/server-communication/ts/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,12 @@
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
// #docregion override-default-options
import { HttpModule, JsonpModule, RequestOptions } from '@angular/http';
import { HttpModule, JsonpModule } from '@angular/http';


// #enddocregion override-default-options
import { InMemoryWebApiModule } from 'angular-in-memory-web-api';
import { HeroData } from './hero-data';
import { requestOptionsProvider } from './default-request-options.service';

import { AppComponent } from './app.component';

Expand All @@ -35,16 +35,12 @@ import { WikiSmartComponent } from './wiki/wiki-smart.component';
WikiComponent,
WikiSmartComponent
],
// #docregion provide-default-request-options
providers: [ requestOptionsProvider ],
// #enddocregion provide-default-request-options
bootstrap: [ AppComponent ]
})
// #docregion override-default-request-options
export class AppModule {
constructor(requestOptions: RequestOptions) {
// Set the default 'Content-Type' header
requestOptions.headers.set('Content-Type', 'application/json');
}
}
// #enddocregion override-default-request-options
export class AppModule {}



Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
// #docregion
import { BaseRequestOptions, RequestOptions } from '@angular/http';

export class DefaultRequestOptions extends BaseRequestOptions {

constructor() {
super();

// Set the default 'Content-Type' header
this.headers.set('Content-Type', 'application/json');
}
}

export const requestOptionsProvider = {provide: RequestOptions, useClass: DefaultRequestOptions };
22 changes: 14 additions & 8 deletions public/docs/ts/latest/guide/server-communication.jade
Original file line number Diff line number Diff line change
Expand Up @@ -659,22 +659,28 @@ a#override-default-request-options
The `HttpModule` provides these default options via the `RequestOptions` token.

You can override these defaults to suit your application needs.
The API docs suggest creating a custom sub-class of `RequestOptions`
and providing that as a replacement class for the `RequestOptions` token.
by creating a custom sub-class of `RequestOptions`
that sets the default options for the application.

Perhaps an easier way is to inject the current `RequestOptions` instance
into an application module constructor and re-set its values directly.
This sample sets the default `Content-Type` header to JSON in the root `AppModule` constructor:
+makeExample('server-communication/ts/app/app.module.ts', 'override-default-request-options', 'app/app.module.ts (default request header override)')(format=".")
This sample creates a class that sets the default `Content-Type` header to JSON.
It exports a constant with the necessary `RequestOptions` provider to simplify registration in `AppModule`.

+makeExample('server-communication/ts/app/default-request-options.service.ts', '', 'app/default-request-options.service.ts')(format=".")
:marked
Then it registers the provider in the root `AppModule`.
+makeExample('server-communication/ts/app/app.module.ts', 'provide-default-request-options', 'app/app.module.ts (provide default request header)')(format=".")
.l-sub-section
:marked
Remember to include this provider during setup when unit testing the app's HTTP services.
:marked
After this change, the `header` option setting in `HeroService.addHero` is no longer necessary,

+makeExample('server-communication/ts/app/toh/hero.service.ts', 'addhero', 'app/toh/hero.service.ts (addHero)')(format=".")
:marked
You can confirm this works by looking at the network tab.
You can confirm that `DefaultRequestOptions` is working by examing HTTP requests in the browser developer tools' network tab.
If you're short-circuiting the server call with something like the [_in-memory web api_](#in-mem-web-api),
try commenting-out the `addHero` header option,
set a breakpoint on the POST call, and step through to the backend request
set a breakpoint on the POST call, and step through the request processing
to verify the header is there.

Individual requests options, like this one, take precedence over the default `RequestOptions`.
Expand Down