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

Closes #5756
This commit is contained in:
Kathy Walrath 2015-12-09 10:22:40 -08:00
parent db096a5e22
commit f4d937ad8d
8 changed files with 44 additions and 20 deletions

View File

@ -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.

View File

@ -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.

View File

@ -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:

View File

@ -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.

View File

@ -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.

View File

@ -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.

View File

@ -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.

View File

@ -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.