docs(cheatsheet): add Dart-specific syntax & headings

kwalrath · kwalrath · commit f4d937ad8dcb · 2015-12-09T23:05:23.000Z
Closes angular#5756
diff --git a/modules/angular2/docs/cheatsheet/built-in-directives.md b/modules/angular2/docs/cheatsheet/built-in-directives.md
@@ -2,7 +2,8 @@
 Built-in directives
 @cheatsheetIndex 2
 @description
-`import {NgIf, ...} from 'angular2/angular2';`
+{@target js ts}`import {NgIf, ...} from 'angular2/angular2';`{@endtarget}
+{@target dart}`import 'package:angular2/angular2.dart';`{@endtarget}
 
 @cheatsheetItem
 syntax:
@@ -30,4 +31,4 @@ Conditionally swaps the contents of the div by selecting one of the embedded tem
 syntax:
 `<div [ng-class]="{active: isActive, disabled: isDisabled}">`|`[ng-class]`
 description:
-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.
+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.
diff --git a/modules/angular2/docs/cheatsheet/class-decorators.md b/modules/angular2/docs/cheatsheet/class-decorators.md
@@ -2,26 +2,36 @@
 Class decorators
 @cheatsheetIndex 4
 @description
-`import {Directive, ...} from 'angular2/angular2';`
+{@target js ts}`import {Directive, ...} from 'angular2/angular2';`{@endtarget}
+{@target dart}`import 'package:angular2/angular2.dart';`{@endtarget}
 
 @cheatsheetItem
-syntax:
+syntax(js ts):
 `@Component({...})
 class MyComponent() {}`|`@Component({...})`
+syntax(dart):
+`@Component(...)
+class MyComponent() {}`|`@Component(...)`
 description:
 Declares that a class is a component and provides metadata about the component.
 
 @cheatsheetItem
-syntax:
+syntax(js ts):
 `@Pipe({...})
 class MyPipe() {}`|`@Pipe({...})`
+syntax(dart):
+`@Pipe(...)
+class MyPipe() {}`|`@Pipe(...)`
 description:
 Declares that a class is a pipe and provides metadata about the pipe.
 
 @cheatsheetItem
-syntax:
+syntax(js ts):
+`@Injectable()
+class MyService() {}`|`@Injectable()`
+syntax(dart):
 `@Injectable()
 class MyService() {}`|`@Injectable()`
 description:
 Declares that a class has dependencies that should be injected into the constructor when the dependency
-injector is creating an instance of this class.
+injector is creating an instance of this class.
diff --git a/modules/angular2/docs/cheatsheet/dependency-injection.md b/modules/angular2/docs/cheatsheet/dependency-injection.md
@@ -2,7 +2,8 @@
 Dependency injection configuration
 @cheatsheetIndex 9
 @description
-`import {provide} from 'angular2/angular2';`
+{@target js ts}`import {provide} from 'angular2/angular2';`{@endtarget}
+{@target dart}`import 'package:angular2/angular2.dart';`{@endtarget}
 
 @cheatsheetItem
 syntax:
diff --git a/modules/angular2/docs/cheatsheet/directive-and-component-decorators.md b/modules/angular2/docs/cheatsheet/directive-and-component-decorators.md
@@ -2,7 +2,8 @@
 Class field decorators for directives and components
 @cheatsheetIndex 7
 @description
-`import {Input, ...} from 'angular2/angular2';`
+{@target js ts}`import {Input, ...} from 'angular2/angular2';`{@endtarget}
+{@target dart}`import 'package:angular2/angular2.dart';`{@endtarget}
 
 @cheatsheetItem
 syntax:
@@ -59,4 +60,4 @@ Binds the first result of the component view query (myPredicate) to the myChildC
 syntax:
 `@ViewChildren(myPredicate) myChildComponents;`|`@ViewChildren(myPredicate)`
 description:
-Binds the results of the component view query (myPredicate) to the myChildComponents property of the class. Not available for directives.
+Binds the results of the component view query (myPredicate) to the myChildComponents property of the class. Not available for directives.
diff --git a/modules/angular2/docs/cheatsheet/directive-configuration.md b/modules/angular2/docs/cheatsheet/directive-configuration.md
@@ -2,7 +2,8 @@
 Directive configuration
 @cheatsheetIndex 5
 @description
-`@Directive({ property1: value1, ... }) )`
+{@target js ts}`@Directive({ property1: value1, ... })`{@endtarget}
+{@target dart}`@Directive(property1: value1, ...)`{@endtarget}
 
 @cheatsheetItem
 syntax:
@@ -17,4 +18,4 @@ Does not support parent-child relationship selectors.
 syntax:
 `providers: [MyService, provide(...)]`|`providers:`
 description:
-Array of dependency injection providers for this directive and its children.
+Array of dependency injection providers for this directive and its children.
diff --git a/modules/angular2/docs/cheatsheet/forms.md b/modules/angular2/docs/cheatsheet/forms.md
@@ -2,10 +2,11 @@
 Forms
 @cheatsheetIndex 3
 @description
-`import {FORM_DIRECTIVES} from 'angular2/angular2';`
+{@target js ts}`import {FORM_DIRECTIVES} from 'angular2/angular2';`{@endtarget}
+{@target dart}`import 'package:angular2/angular2.dart';`{@endtarget}
 
 @cheatsheetItem
 syntax:
 `<input [(ng-model)]="userName">`|`[(ng-model)]`
 description:
-Provides two-way data-binding, parsing and validation for form controls.
+Provides two-way data-binding, parsing and validation for form controls.
diff --git a/modules/angular2/docs/cheatsheet/lifecycle hooks.md b/modules/angular2/docs/cheatsheet/lifecycle hooks.md
@@ -5,8 +5,10 @@ Directive and component change detection and lifecycle hooks
 (implemented as class methods)
 
 @cheatsheetItem
-syntax:
+syntax(js ts):
 `constructor(myService: MyService, ...) { ... }`|`constructor(myService: MyService, ...)`
+syntax(dart):
+`MyAppComponent(MyService myService, ...) { ... }`|`MyAppComponent(MyService myService, ...)`
 description:
 The class constructor is called before any other lifecycle hook. Use it to inject dependencies, but avoid any serious work here.
 
@@ -64,4 +66,4 @@ Called after every check of the component's view. Applies to components only.
 syntax:
 `ngOnDestroy() { ... }`|`ngOnDestroy()`
 description:
-Called once, before the instance is destroyed.
+Called once, before the instance is destroyed.
diff --git a/modules/angular2/docs/cheatsheet/routing.md b/modules/angular2/docs/cheatsheet/routing.md
@@ -2,17 +2,22 @@
 Routing and navigation
 @cheatsheetIndex 10
 @description
-`import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, ...} from 'angular2/router';`
+{@target js ts}`import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, ...} from 'angular2/router';`{@endtarget}
+{@target dart}`import 'package:angular2/angular2.dart';`{@endtarget}
 
 
 @cheatsheetItem
-syntax:
+syntax(js ts):
 `@RouteConfig([
   { path: '/:myParam', component: MyComponent, as: 'MyCmp' },
   { path: '/staticPath', component: ..., as: ...},
   { path: '/*wildCardParam', component: ..., as: ...}
 ])
 class MyComponent() {}`|`@RouteConfig`
+syntax(dart):
+`@RouteConfig(const [
+  const Route(path: '/:myParam', component: MyComponent, name: 'MyCmp' ),
+])`
 description:
 Configures routes for the decorated component. Supports static, parameterized and wildcard routes.
 
@@ -32,8 +37,10 @@ Creates a link to a different view based on a route instruction consisting of a
 
 
 @cheatsheetItem
-syntax:
+syntax(js ts):
 `@CanActivate(() => { ... })class MyComponent() {}`|`@CanActivate`
+syntax(dart):
+`@CanActivate(() => ...)class MyComponent() {}`|`@CanActivate`
 description:
 A component decorator defining a function that the router should call first to determine if it should activate this component. Should return a boolean or a promise.
 
@@ -70,4 +77,4 @@ The router calls the routerCanDeactivate methods (if defined) of every component
 syntax:
 `routerOnDeactivate(nextInstruction, prevInstruction) { ... }`|`routerOnDeactivate`
 description:
-Called before the directive is removed as the result of a route change. May return a promise that pauses removing the directive until the promise resolves.
+Called before the directive is removed as the result of a route change. May return a promise that pauses removing the directive until the promise resolves.
