docs: refactor pipe example to use the HttpClient

docs: fix typos in 'Httpclient' docs (angular#19127)

PR Close angular#19127

docs(router): add `paramsInheritanceStrategy` documentation (angular#22590)

PR Close angular#22590

docs: add app.module to changed documents (angular#23876)

PR Close angular#23876

docs: clarify faqs about services (angular#24079)

PR Close angular#24079

docs(aio): added a link to Angular Zero online course (Traditional Chinese) (angular#24228)

PR Close angular#24228

docs: describe rounding behaviour of 'DecimalPipe' (angular#24303)

PR Close angular#24303

docs(common): fix in the documentation of PUT (angular#24528)
PR Close angular#24528

docs: add workspace and related cli terms (angular#24633)

PR Close angular#24633

docs(changelog): correct inaccuracies (angular#24713)
PR Close angular#24713

test: integration test for TS 2.9.x (angular#24749)

PR Close angular#24749

fix(ivy): pipes are pure by default (angular#24750)

PR Close angular#24750

build(bazel): update to rule_nodejs 0.10.0 (angular#24759)

PR Close angular#24759

build: upgrade jasmine (and related typings) to latest version (angular#19904)

With these changes, the types are a little stricter now and also not
compatible with Protractor's jasmine-like syntax. So, we have to also
use `@types/jasminewd2` for e2e tests (but not for non-e2e tests).

I also had to "augment" `@types/jasminewd2`, because the latest
typings from [DefinitelyTyped][1] do not reflect the fact that the
`jasminewd2` version (v2.1.0) currently used by Protractor supports
passing a `done` callback to a spec.

[1]: https://github.com/DefinitelyTyped/DefinitelyTyped/blob/566e0394859fdc1dc893658ccec6b06372d56a91/types/jasminewd2/index.d.ts#L9-L15

Fixes angular#23952
Closes angular#24733

PR Close angular#19904

test: make `NgMatchers` type-aware (angular#19904)

PR Close angular#19904

refactor: infer type for `it()` assertion functions (angular#19904)

PR Close angular#19904

build: upgrade jasmine to 2.99.x and fix tests (angular#19904)

PR Close angular#19904

refactor: re-organize and "modernize" cjs-jasmine scripts (angular#19904)

PR Close angular#19904

test: run unit tests in random order (angular#19904)

PR Close angular#19904

build: upgrade jasmine to 3.1.0 (angular#19904)

PR Close angular#19904

build: upgrade karma and related dependencies (angular#19904)

PR Close angular#19904

docs: refactored ng-container code (angular#22742)


PR Close angular#22742

docs: update Angular Boot Camp description (angular#23653)

PR Close angular#23653

feat(service-worker): add support for `?` in SW config globbing (angular#24105)

The globbing is used in the following sections:
- `assetGroups` > `resources` > `files`/`versionedFiles`
- `assetGroups` > `resources` > `urls`
- `dataGroups` > `urls`
- `navigationUrls`

Query params are ignored for `files`/`versionedFiles` and
`navigationUrls`, but they are still taken into account for
`assetGroups`/`dataGroups` `urls`. To avoid a breaking change, `?` is
matched literally for these patterns.

PR Close angular#24105

refactor(service-worker): avoid unnecessary operations and remove unused code (angular#24127)

PR Close angular#24127

fix(service-worker): avoid network requests when looking up hashed resources in cache (angular#24127)

PR Close angular#24127

feat(ivy): properly apply style="", [style], [style.foo] and [attr.style] bindings (angular#24602)

PR Close angular#24602

fix(language-service): do not overwrite native `Reflect` (angular#24299)

Fixes angular#21420

PR Close angular#24299

fix(common): use correct currency format for locale de-AT (angular#24658)

Fixes angular#24609
PR Close angular#24658

fix(ivy): correctly resolve Array  property access (angular#24664)

PR Close angular#24664

build: make `internal-angular` karma reporter compatible with latest karma (angular#24803)

Due to changes in karma@1.0.0, `internal-angular` karma reporter stopped
showing browser logs (such as `console.log()` etc.).
Related to d571a51.

PR Close angular#24803

build: remove unnecessary `internal-angular` karma reporter (angular#24803)

The reporter was added in 87d56ac, with the purpose of fixing
source-map paths (which was apparently needed back then). Things have
moved around a lot since then and the custom reporter doesn't seem to be
necessary any more. By removing the reporter, we have one less thing to
worry about while upgrading karma; plus we get improvements in built-in
reporters for free.

Output with the custom reporter:
```
at someMethod (packages/core/.../some-file.ts:13:37)
```

Output with the built-in reporter:
```
at someMethod (packages/core/.../some-file.ts:13.37 <- dist/all/@angular/core/.../some-file.js:1:337)
```

PR Close angular#24803

fix(core): mark NgModule as not the root if APP_ROOT is set to false (angular#24814)

Tree shakable providers use the APP_ROOT token to determine where to attach themselves. APP_ROOT gets set on NgModule with BrowserModule irrespective of whether it is actually the root(Ex. in case of SSR app where the shell app is first bootstrapped without BrowserModule being the root module).

This change allows a NgModule with BrowserModule to explicitly mark itself as not the root by setting APP_ROOT token to false. This allows tree shakable providers to be attached to the right rott module.

PR Close angular#24814

fix(platform-browser): mark Meta and Title services as tree shakable providers (angular#24815)

This lets services that use Meta and Title services to be tree shakable and provided in root.

PR Close angular#24815

docs(aio): unified console.log single string style (angular#22737)
PR Close angular#22737

docs: unified console.log single string style (angular#22737)


PR Close angular#22737

fix(compiler-cli): Use typescript to resolve modules for metadata (angular#22856)

The current module resolution simply attaches .ts to the import/export path, which does
not work if the path is using Node / CommonJS behavior to resolve to an index.ts file.
This patch uses typescript's module resolution logic, and will attempt to load the original
typescript file if this resolution returns a .js or .d.ts file

PR Close angular#22856

docs: clarify wording in architecture overview (angular#24481)

Closes angular#23463
Closes angular#22158

PR Close angular#24481

docs: add tree-shakable providers (angular#24481)

PR Close angular#24481

fix(ivy): support projecting into dynamic views (angular#24752)

PR Close angular#24752

refactor(ivy): replace pNextOrParent with TNode props (angular#24752)

PR Close angular#24752

docs: fix typo in Universal guide (angular#24812)

PR Close angular#24812

fix(platform-browser): workaround wrong import path generated by ngc for DOCUMENT (angular#24830)


docs: correct project definition (angular#24807)

PR Close angular#24807

build: update to latest nodejs bazel rules (angular#24817)

PR Close angular#24817

fix(common): do not round factional seconds (angular#24831)

fixes angular#24384

PR Close angular#24831

docs: fix typos referencing inline component styles (angular#22557)

PR Close angular#22557

fix(router): add ability to recover from malformed url (angular#23283)

Fixes angular#21468

PR Close angular#23283

docs: fix incorrect forms selector references (angular#22631)

PR Close angular#22631

docs(aio): unified string chaining (angular#22735)
PR Close angular#22735

docs: unified string chaining (angular#22735)


PR Close angular#22735

docs(forms): added missing backtick (angular#24451)

Fixed trivial markdown problem with a missing backtick.

PR Close angular#24451

docs(forms): update API reference for form validators (angular#24734)

PR Close angular#24734

Merge remote-tracking branch 'upstream/master' into refactor-example-pipe

CHANGELOG.md

@@ -1,6 +1,10 @@
 <a name="6.1.0-beta.3"></a>
 # [6.1.0-beta.3](https://github.com/angular/angular/compare/6.1.0-beta.2...6.1.0-beta.3) (2018-06-28)
 
+### Bug Fixes
+
+* **animations:** set animations styles properly on platform-server ([#24624](https://github.com/angular/angular/issues/24624)) ([0b356d4](https://github.com/angular/angular/commit/0b356d4))
+* **common:** use correct ICU plural for locale mk ([#24659](https://github.com/angular/angular/issues/24659)) ([64a8584](https://github.com/angular/angular/commit/64a8584))
 
 <a name="6.0.7"></a>
 ## [6.0.7](https://github.com/angular/angular/compare/6.0.6...6.0.7) (2018-06-27)
@@ -77,7 +81,7 @@
 
 
 <a name="6.1.0-beta.0"></a>
-## [6.1.0-beta.0](https://github.com/angular/angular/compare/6.0.0-rc.5...6.1.0-beta.0) (2018-06-06)
+# [6.1.0-beta.0](https://github.com/angular/angular/compare/6.0.0-rc.5...6.1.0-beta.0) (2018-06-06)
 
 
 ### Bug Fixes

WORKSPACE

@@ -6,9 +6,9 @@ workspace(name = "angular")
 
 http_archive(
     name = "build_bazel_rules_nodejs",
-    url = "https://github.com/bazelbuild/rules_nodejs/archive/0.9.1.zip",
-    strip_prefix = "rules_nodejs-0.9.1",
-    sha256 = "6139762b62b37c1fd171d7f22aa39566cb7dc2916f0f801d505a9aaf118c117f",
+    url = "https://github.com/bazelbuild/rules_nodejs/archive/0.10.1.zip",
+    strip_prefix = "rules_nodejs-0.10.1",
+    sha256 = "634206524d90dc03c52392fa3f19a16637d2bcf154910436fe1d669a0d9d7b9c",
 )
 
 http_archive(

aio/content/examples/ngcontainer/src/app/app.component.css

@@ -4,7 +4,8 @@ button {
   font-size: 100%;
 }
 
-code, .code {
+code,
+.code {
   background-color: #eee;
   color: black;
   font-family: Courier, sans-serif;
@@ -21,14 +22,18 @@ div.code {
 }
 
 hr {
-  margin: 40px 0
+  margin: 40px 0;
 }
 
-td, th {
+td,
+th {
   text-align: left;
   vertical-align: top;
 }
 
 /* #docregion p-span */
-p span { color: red; font-size: 70%; }
+p span {
+  color: red;
+  font-size: 70%;
+}
 /* #enddocregion p-span */

aio/content/examples/ngcontainer/src/app/app.component.html

@@ -132,7 +132,7 @@ <h4>#1 &lt;ng-container&gt; and &lt;options&gt;</h4>
 <!-- #docregion select-span -->
 <select [(ngModel)]="hero">
   <span *ngFor="let h of heroes">
-    <span *ngIf="showSad || h?.emotion != 'sad'">
+    <span *ngIf="showSad || h?.emotion !== 'sad'">
       <option [ngValue]="h">{{h.name}} ({{h?.emotion}})</option>
     </span>
   </span>
@@ -147,7 +147,7 @@ <h4>#1 &lt;ng-container&gt; and &lt;options&gt;</h4>
 <!-- #docregion select-ngcontainer -->
 <select [(ngModel)]="hero">
   <ng-container *ngFor="let h of heroes">
-    <ng-container *ngIf="showSad || h?.emotion != 'sad'">
+    <ng-container *ngIf="showSad || h?.emotion !== 'sad'">
       <option [ngValue]="h">{{h.name}} ({{h?.emotion}})</option>
     </ng-container>
   </ng-container>

aio/content/examples/ngcontainer/src/app/app.component.ts

@@ -6,14 +6,15 @@ import { heroes } from './hero';
 @Component({
   selector: 'my-app',
   templateUrl: './app.component.html',
-  styleUrls: [ './app.component.css' ]
+  styleUrls: ['./app.component.css']
 })
 export class AppComponent {
   heroes = heroes;
   hero = this.heroes[0];
-  heroTraits = [ 'honest', 'brave', 'considerate' ];
+  heroTraits = ['honest', 'brave', 'considerate'];
 
   // flags for the table
+
   attrDirs = true;
   strucDirs = true;
   divNgIf = false;

aio/content/examples/ngcontainer/src/app/app.module.ts

@@ -1,9 +1,9 @@
 // #docregion
-import { NgModule }      from '@angular/core';
-import { FormsModule }   from '@angular/forms';
+import { NgModule } from '@angular/core';
+import { FormsModule } from '@angular/forms';
 import { BrowserModule } from '@angular/platform-browser';
 
-import { AppComponent }     from './app.component';
+import { AppComponent } from './app.component';
 import { ContentComponent } from './content.component';
 import { heroComponents } from './hero.components';
 

aio/content/examples/ngcontainer/src/app/hero.components.ts

@@ -1,5 +1,6 @@
 // #docregion
 import { Component, Input } from '@angular/core';
+
 import { Hero } from './hero';
 
 @Component({
@@ -33,11 +34,15 @@ export class ConfusedHeroComponent {
 export class UnknownHeroComponent {
   @Input() hero: Hero;
   get message() {
-    return this.hero && this.hero.name ?
-      `${this.hero.name} is strange and mysterious.` :
-      'Are you feeling indecisive?';
+    return this.hero && this.hero.name
+      ? `${this.hero.name} is strange and mysterious.`
+      : 'Are you feeling indecisive?';
   }
 }
 
-export const heroComponents =
-  [ HappyHeroComponent, SadHeroComponent, ConfusedHeroComponent, UnknownHeroComponent ];
+export const heroComponents = [
+  HappyHeroComponent,
+  SadHeroComponent,
+  ConfusedHeroComponent,
+  UnknownHeroComponent
+];

aio/content/examples/ngcontainer/src/app/hero.ts

@@ -6,8 +6,8 @@ export class Hero {
 }
 
 export const heroes: Hero[] = [
-  { id: 1, name: 'Mr. Nice',  emotion: 'happy'},
-  { id: 2, name: 'Narco',     emotion: 'sad' },
+  { id: 1, name: 'Mr. Nice', emotion: 'happy' },
+  { id: 2, name: 'Narco', emotion: 'sad' },
   { id: 3, name: 'Windstorm', emotion: 'confused' },
-  { id: 4, name: 'Magneta'}
+  { id: 4, name: 'Magneta' }
 ];

aio/content/examples/pipes/src/app/app.module.ts

@@ -1,26 +1,23 @@
 // #docregion
+import { HttpClientModule } from '@angular/common/http';
 import { NgModule } from '@angular/core';
-import { BrowserModule } from '@angular/platform-browser';
 import { FormsModule } from '@angular/forms';
 import { HttpClientModule } from '@angular/common/http';
 
 import { AppComponent } from './app.component';
+import { ExponentialStrengthPipe } from './exponential-strength.pipe';
+import { FetchJsonPipe } from './fetch-json.pipe';
 import {
   FlyingHeroesComponent,
   FlyingHeroesImpureComponent
 } from './flying-heroes.component';
+import { FlyingHeroesImpurePipe, FlyingHeroesPipe } from './flying-heroes.pipe';
 import { HeroAsyncMessageComponent } from './hero-async-message.component';
 import { HeroBirthdayComponent } from './hero-birthday1.component';
 import { HeroBirthday2Component } from './hero-birthday2.component';
 import { HeroListComponent } from './hero-list.component';
-import { PowerBoosterComponent } from './power-booster.component';
 import { PowerBoostCalculatorComponent } from './power-boost-calculator.component';
-import {
-  FlyingHeroesPipe,
-  FlyingHeroesImpurePipe
-} from './flying-heroes.pipe';
-import { FetchJsonPipe } from './fetch-json.pipe';
-import { ExponentialStrengthPipe } from './exponential-strength.pipe';
+import { PowerBoosterComponent } from './power-booster.component';
 
 @NgModule({
   imports: [
@@ -43,6 +40,6 @@ import { ExponentialStrengthPipe } from './exponential-strength.pipe';
     FetchJsonPipe,
     ExponentialStrengthPipe
   ],
-  bootstrap: [ AppComponent ]
+  bootstrap: [AppComponent]
 })
-export class AppModule { }
+export class AppModule {}

aio/content/examples/pipes/src/app/fetch-json.pipe.ts

@@ -1,23 +1,24 @@
 // #docregion
+import { HttpClient } from '@angular/common/http';
 import { Pipe, PipeTransform } from '@angular/core';
-import { HttpClient }          from '@angular/common/http';
+
 // #docregion pipe-metadata
 @Pipe({
   name: 'fetch',
   pure: false
 })
 // #enddocregion pipe-metadata
-export class FetchJsonPipe  implements PipeTransform {
+export class FetchJsonPipe implements PipeTransform {
   private cachedData: any = null;
   private cachedUrl = '';
 
-  constructor(private http: HttpClient) { }
+  constructor(private http: HttpClient) {}
 
   transform(url: string): any {
     if (url !== this.cachedUrl) {
       this.cachedData = null;
       this.cachedUrl = url;
-      this.http.get(url).subscribe( result => this.cachedData = result );
+      this.http.get(url).subscribe(result => (this.cachedData = result));
     }
 
     return this.cachedData;

aio/content/examples/toh-pt6/src/app/hero.service.ts

@@ -40,7 +40,7 @@ export class HeroService {
   // #enddocregion getHeroes-1
       .pipe(
         // #enddocregion getHeroes-2
-        tap(heroes => this.log(`fetched heroes`)),
+        tap(heroes => this.log('fetched heroes')),
         // #docregion getHeroes-2
         catchError(this.handleError('getHeroes', []))
       );
@@ -151,7 +151,7 @@ export class HeroService {
   // #docregion log
   /** Log a HeroService message with the MessageService */
   private log(message: string) {
-    this.messageService.add('HeroService: ' + message);
+    this.messageService.add(`HeroService: ${message}`);
   }
   // #enddocregion log
 }

aio/content/examples/universal/src/app/hero.service.ts

@@ -30,7 +30,7 @@ export class HeroService {
   getHeroes (): Observable<Hero[]> {
     return this.http.get<Hero[]>(this.heroesUrl)
       .pipe(
-        tap(heroes => this.log(`fetched heroes`)),
+        tap(heroes => this.log('fetched heroes')),
         catchError(this.handleError('getHeroes', []))
       );
   }
@@ -123,6 +123,6 @@ export class HeroService {
 
   /** Log a HeroService message with the MessageService */
   private log(message: string) {
-    this.messageService.add('HeroService: ' + message);
+    this.messageService.add(`HeroService: ${message}`);
   }
 }

aio/content/guide/architecture-components.md

@@ -8,9 +8,10 @@ A _component_ controls a patch of screen called a *view*. For example, individua
 * The list of heroes.
 * The hero editor.
 
-You define a component's application logic—what it does to support the view—inside a class. The class interacts with the view through an API of properties and methods.
+You define a component's application logic—what it does to support the view—inside a class.
+The class interacts with the view through an API of properties and methods.
 
-For example, the `HeroListComponent` has a `heroes` property that returns an array of heroes that it acquires from a service. `HeroListComponent` also has a `selectHero()` method that sets a `selectedHero` property when the user clicks to choose a hero from that list.
+For example, the `HeroListComponent` has a `heroes` property that holds an array of heroes. It also has a `selectHero()` method that sets a `selectedHero` property when the user clicks to choose a hero from that list. The component acquires the heroes from a service, which is a TypeScript [parameter property[(http://www.typescriptlang.org/docs/handbook/classes.html#parameter-properties) on the constructor. The service is provided to the component through the dependency injection system.
 
 <code-example path="architecture/src/app/hero-list.component.ts" linenums="false" title="src/app/hero-list.component.ts (class)" region="class"></code-example>
 
@@ -39,8 +40,7 @@ Angular inserts an instance of the `HeroListComponent` view between those tags.
 
 * `templateUrl`: The module-relative address of this component's HTML template. Alternatively, you can provide the HTML template inline, as the value of the `template` property. This template defines the component's _host view_.
 
-* `providers`: An array of **dependency injection providers** for services that the component requires. In the example, this tells Angular that the component's constructor requires a `HeroService` instance
-in order to get the list of heroes to display.
+* `providers`: An array of **dependency injection providers** for services that the component requires. In the example, this tells Angular how provide the `HeroService` instance that the component's constructor uses to get the list of heroes to display.  
 
 <hr/>
 

aio/content/guide/architecture-modules.md

@@ -88,7 +88,8 @@ For example, import Angular's `Component` decorator from the `@angular/core` lib
 
 <code-example path="architecture/src/app/app.component.ts" region="import" linenums="false"></code-example>
 
-You also import NgModules from Angular _libraries_ using JavaScript import statements:
+You also import NgModules from Angular _libraries_ using JavaScript import statements. 
+For example, the following code imports the `BrowserModule` NgModule from the `platform-browser` library:
 
 <code-example path="architecture/src/app/mini-app.ts" region="import-browser-module" linenums="false"></code-example>
 

aio/content/guide/architecture-services.md

@@ -60,11 +60,29 @@ The process of `HeroService` injection looks something like this:
 
 ### Providing services
 
-You must register at least one *provider* of any service you are going to use. You can register providers in modules or in components.
+You must register at least one *provider* of any service you are going to use. A service can register providers itself, making it available everywhere, or you can register providers with specific modules or components. You register providers in the metadata of the service (in the `@Injectable` decorator), or in the `@NgModule` or `@Component` metadata 
 
-* When you add providers to the [root module](guide/architecture-modules), the same instance of a service is available to all components in your app.
+* By default, the Angular CLI command `ng generate service` registers a provider with the root injector for your service by including provider metadata in the `@Injectable` decorator. The tutorial uses this method to register the provider of  HeroService class definition:
 
-<code-example path="architecture/src/app/app.module.ts" linenums="false" title="src/app/app.module.ts (module providers)" region="providers"></code-example>
+``` 
+@Injectable({
+  providedIn: 'root',
+})
+``` 
+
+ When you provide the service at the root level, Angular creates a single, shared instance of HeroService and injects into any class that asks for it. Registering the provider in the `@Injectable` metadata also allows Angular to optimize an app by removing the service if it turns out not to be used after all. 
+
+* When you register a provider with a [specific NgModule](guide/architecture-modules), the same instance of a service is available to all components in that NgModule. To register at this level, use the `providers` property of the `@NgModule` decorator:
+
+``` 
+@NgModule({
+  providers: [
+   BackendService,
+   Logger
+ ],
+ ...
+})
+``` 
 
 * When you register a provider at the component level, you get a new instance of the
 service with each new instance of that component. At the component level, register a service provider in the `providers` property of the `@Component` metadata:

aio/content/guide/component-styles.md

@@ -164,7 +164,7 @@ They are _not inherited_ by any components nested within the template nor by any
 
 </div>
 
-The CLI defines an empty `styles` array when you create the component with the `--inline-styles` flag.
+The CLI defines an empty `styles` array when you create the component with the `--inline-style` flag.
 
 <code-example language="sh" class="code-shell">
 ng generate component hero-app --inline-style
@@ -189,7 +189,7 @@ They are _not inherited_ by any components nested within the template nor by any
 
 <div class="l-sub-section">
 
-  You can specify more than one styles file or even a combination of `style` and `styleUrls`.
+  You can specify more than one styles file or even a combination of `styles` and `styleUrls`.
 
 </div>
 

aio/content/guide/forms.md

@@ -152,7 +152,8 @@ nothing to distinguish it from any component you've written before.
 Understanding this component requires only the Angular concepts covered in previous pages.
 
 * The code imports the Angular core library and the `Hero` model you just created.
-* The `@Component` selector value of "hero-form" means you can drop this form in a parent template with a `<hero-form>` tag.
+* The `@Component` selector value of "app-hero-form" means you can drop this form in a parent
+template with a `<app-hero-form>` tag.
 * The `templateUrl` property points to a separate file for the template HTML.
 * You defined dummy data for `model` and `powers`, as befits a demo.