From 533b722c6635c1d01119d5b5163476c83c772ee6 Mon Sep 17 00:00:00 2001
From: Peter Bacon Darwin <pete@bacondarwin.com>
Date: Thu, 5 Nov 2015 12:33:56 +0000
Subject: [PATCH] docs(*): move cheatsheet stuff into its own files

---
 .../angular2/docs/cheatsheet/bootstrapping.md | 56 +++++++++++++++++++
 .../docs/cheatsheet/built-in-directives.md    | 24 ++++++++
 .../src/common/directives/core_directives.ts  | 23 --------
 modules/angular2/src/core/application.ts      | 55 ------------------
 4 files changed, 80 insertions(+), 78 deletions(-)
 create mode 100644 modules/angular2/docs/cheatsheet/bootstrapping.md
 create mode 100644 modules/angular2/docs/cheatsheet/built-in-directives.md

diff --git a/modules/angular2/docs/cheatsheet/bootstrapping.md b/modules/angular2/docs/cheatsheet/bootstrapping.md
new file mode 100644
index 0000000000..b863e09470
--- /dev/null
+++ b/modules/angular2/docs/cheatsheet/bootstrapping.md
@@ -0,0 +1,56 @@
+@cheatsheetSection
+@name Bootstrapping
+@description
+`import {bootstrap} from 'angular2/angular2';`
+
+@cheatsheetItem
+`<input [value]="firstName">`|`[value]`
+Binds property `value` to the result of expression `firstName`.
+
+@cheatsheetItem
+`<div [attr.role]="myAriaRole">`|`[attr.role]`
+Binds attribute `role` to the result of expression `myAriaRole`.
+
+@cheatsheetItem
+`<div [class.extra-sparkle]="isDelightful">`|`[class.extra-sparkle]`
+Binds the presence of the css class `extra-sparkle` on the element to the truthiness of the expression `isDelightful`.
+
+@cheatsheetItem
+`<div [style.width.px]="mySize">`|`[style.width.px]`
+Binds style property `width` to the result of expression `mySize` in pixels. Units are optional.
+
+@cheatsheetItem
+`<button (click)="readRainbow($event)">`|`(click)`
+Calls method `readRainbow` when a click event is triggered on this button element (or its children) and passes in the event object.
+
+@cheatsheetItem
+`<div title="Hello {{ponyName}}">`|`{{ponyName}}`
+Binds a property to an interpolated string, e.g. "Hello Seabiscuit". Equivalent to:
+`<div [title]="'Hello' + ponyName">`
+
+@cheatsheetItem
+`<p>Hello {{ponyName}}</p>`|`{{ponyName}}`
+Binds text content to an interpolated string, e.g. "Hello Seabiscuit".
+
+@cheatsheetItem
+`<my-cmp [(title)]="name">`|`[(title)]`
+Sets up two-way data binding. Equivalent to: `<my-cmp [title]="name" (title-change)="name=$event">`
+
+@cheatsheetItem
+`<video #movieplayer ...>
+  <button (click)="movieplayer.play()">
+</video>`|`#movieplayer`|`(click)`
+Creates a local variable `movieplayer` that provides access to the `video` element instance in data-binding and event-binding expressions in the current template.
+
+@cheatsheetItem
+`<p *my-unless="myExpression">...</p>`|`*my-unless`
+The `*` symbol means that the current element will be turned into an embedded template. Equivalent to:
+`<template [myless]="myExpression"><p>...</p></template>`
+
+@cheatsheetItem
+`<p>Card No.: {{cardNumber | myCreditCardNumberFormatter}}</p>`|`{{cardNumber | myCreditCardNumberFormatter}}`
+Transforms the current value of expression `cardNumber` via the pipe called `creditCardNumberFormatter`.
+
+@cheatsheetItem
+`<p>Employer: {{employer?.companyName}}</p>`|`{{employer?.companyName}}`
+The Elvis operator (`?`) means that the `employer` field is optional and if `undefined`, the rest of the expression should be ignored.
diff --git a/modules/angular2/docs/cheatsheet/built-in-directives.md b/modules/angular2/docs/cheatsheet/built-in-directives.md
new file mode 100644
index 0000000000..d669bd88e6
--- /dev/null
+++ b/modules/angular2/docs/cheatsheet/built-in-directives.md
@@ -0,0 +1,24 @@
+@cheatsheetSection
+@name Built-in directives
+@description
+`import {NgIf, ...} from 'angular2/angular2';`
+
+@cheatsheetItem
+`<section *ng-if="showSection">`|`*ng-if`
+Removes or recreates a portion of the DOM tree based on the showSection expression.
+
+@cheatsheetItem
+`<li *ng-for="#item of list">`|`*ng-for`
+Turns the li element and its contents into a template, and uses that to instantiate a view for each item in list.
+
+@cheatsheetItem
+`<div [ng-switch]="conditionExpression">
+  <template [ng-switch-when]="case1Exp">...</template>
+  <template ng-switch-when="case2LiteralString">...</template>
+  <template ng-switch-default>...</template>
+</div>`|`[ng-switch]`|`[ng-switch-when]`|`ng-switch-when`|`ng-switch-default`
+Conditionally swaps the contents of the div by selecting one of the embedded templates based on the current value of conditionExpression.
+
+@cheatsheetItem
+`<div [ng-class]="{active: isActive, disabled: isDisabled}">`|`[ng-class]`
+Binds the presence of css classes on the element to the truthiness of the associated map values. The right-hand side expression should return {class-name: true/false} map.
\ No newline at end of file
diff --git a/modules/angular2/src/common/directives/core_directives.ts b/modules/angular2/src/common/directives/core_directives.ts
index 996348977f..f02231a5f9 100644
--- a/modules/angular2/src/common/directives/core_directives.ts
+++ b/modules/angular2/src/common/directives/core_directives.ts
@@ -44,29 +44,6 @@ import {NgSwitch, NgSwitchWhen, NgSwitchDefault} from './ng_switch';
  *   ...
  * }
  * ```
-
- * @cheatsheetSection
- *       Built-in directives
- *       `import {NgIf, ...} from 'angular2/angular2';`
- * @cheatsheetItem
- *       <section *ng-if="showSection">
- *       Removes or recreates a portion of the DOM tree based on the showSection expression.
- *       *ng-if
- * @cheatsheetItem
- *       <li *ng-for="#item of list">
- *       Turns the li element and its contents into a template, and uses that to instantiate a view for each item in list.
- *       '*ng-for'
- * @cheatsheetItem
- *       <div [ng-switch]="conditionExpression">\n  <template [ng-switch-when]="case1Exp">...</template>\n  <template ng-switch-when="case2LiteralString">...</template>\n  <template ng-switch-default>...</template>\n</div>
- *       Conditionally swaps the contents of the div by selecting one of the embedded templates based on the current value of conditionExpression.
- *       [ng-switch]
- *       [ng-switch-when]
- *       ng-switch-when
- *       ng-switch-default
- * @cheatsheetItem
- *       <div [ng-class]="{active: isActive, disabled: isDisabled}">
- *       Binds the presence of css classes on the element to the truthiness of the associated map values. The right-hand side expression should return {class-name: true/false} map.
- *       [ng-class]
  */
 export const CORE_DIRECTIVES: Type[] =
     CONST_EXPR([NgClass, NgFor, NgIf, NgStyle, NgSwitch, NgSwitchWhen, NgSwitchDefault]);
diff --git a/modules/angular2/src/core/application.ts b/modules/angular2/src/core/application.ts
index 9a62425122..b275f2210b 100644
--- a/modules/angular2/src/core/application.ts
+++ b/modules/angular2/src/core/application.ts
@@ -18,61 +18,6 @@ export {
 } from './application_ref';
 
 /// See [commonBootstrap] for detailed documentation.
-/**
- * @cheatsheetSection
- *          Bootstrapping
- *          `import {bootstrap} from 'angular2/angular2';`
- * @cheatsheetItem
- *          <input [value]="firstName">
- *          Binds property value to the result of expression firstName.
- *          [value]
- * @cheatsheetItem
- *          <div [attr.role]="myAriaRole">
- *          Binds attribute role to the result of expression myAriaRole.
- *          [attr.role]
- * @cheatsheetItem
- *          <div [class.extra-sparkle]="isDelightful">
- *          Binds the presence of the css class extra-sparkle on the element to the truthiness of the expression isDelightful.
- *          [class.extra-sparkle]
- * @cheatsheetItem
- *          <div [style.width.px]="mySize">
- *          Binds style property width to the result of expression mySize in pixels. Units are optional.
- *          [style.width.px]
- * @cheatsheetItem
- *          <button (click)="readRainbow($event)">
- *          Calls method readRainbow when a click event is triggered on this button element (or its children) and passes in the event object.
- *          (click)
- * @cheatsheetItem
- *          <div title="Hello {{ponyName}}">
- *          Binds a property to an interpolated string, e.g. "Hello Seabiscuit". Equivalent to: <div [title]="'Hello' + ponyName">
- *          {{ponyName}}
- * @cheatsheetItem
- *          <p>Hello {{ponyName}}</p>
- *          Binds text content to an interpolated string, e.g. "Hello Seabiscuit".
- *          {{ponyName}}
- * @cheatsheetItem
- *          <my-cmp [(title)]="name">
- *          Sets up two-way data binding. Equivalent to:\n<my-cmp [title]="name" (title-change)="name=$event">
- *          [(title)]
- * @cheatsheetItem
- *          <video #movieplayer ...>\n<button (click)="movieplayer.play()" >
- *          Creates a local variable movieplayer that provides access to the video element instance in data- and event-binding expressions in the current template.
- *           #movieplayer
- *           (click)
- * @cheatsheetItem
- *          <p *my-unless="myExpression">...</p>
- *          The * symbol means that the current element will be turned into an embedded template. Equivalent to:\n<template [my-unless]="myExpression"><p>...</p></template>
- *          *my-unless
- * @cheatsheetItem
- *          <p>Card No.: {{cardNumber myCreditCardNumberFormatter}}</p>
- *          Transforms the current value of expression cardNumber via pipe called creditCardNumberFormatter.
- *          {{cardNumber myCreditCardNumberFormatter}}
- * @cheatsheetItem
- *          <p>Employer: {{employer?.companyName}}</p>
- *          The Elvis operator (?) means that the employer field is optional and if undefined, the rest of the expression should be ignored.
- *          {{employer?.companyName}}
- *
- */
 export function bootstrap(
     appComponentType: /*Type*/ any,
     appProviders: Array<Type | Provider | any[]> = null): Promise<ComponentRef> {