parent
db096a5e22
commit
f4d937ad8d
@ -2,7 +2,8 @@
|
|||||||
Built-in directives
|
Built-in directives
|
||||||
@cheatsheetIndex 2
|
@cheatsheetIndex 2
|
||||||
@description
|
@description
|
||||||
`import {NgIf, ...} from 'angular2/angular2';`
|
{@target js ts}`import {NgIf, ...} from 'angular2/angular2';`{@endtarget}
|
||||||
|
{@target dart}`import 'package:angular2/angular2.dart';`{@endtarget}
|
||||||
|
|
||||||
@cheatsheetItem
|
@cheatsheetItem
|
||||||
syntax:
|
syntax:
|
||||||
@ -30,4 +31,4 @@ Conditionally swaps the contents of the div by selecting one of the embedded tem
|
|||||||
syntax:
|
syntax:
|
||||||
`<div [ng-class]="{active: isActive, disabled: isDisabled}">`|`[ng-class]`
|
`<div [ng-class]="{active: isActive, disabled: isDisabled}">`|`[ng-class]`
|
||||||
description:
|
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.
|
||||||
|
@ -2,26 +2,36 @@
|
|||||||
Class decorators
|
Class decorators
|
||||||
@cheatsheetIndex 4
|
@cheatsheetIndex 4
|
||||||
@description
|
@description
|
||||||
`import {Directive, ...} from 'angular2/angular2';`
|
{@target js ts}`import {Directive, ...} from 'angular2/angular2';`{@endtarget}
|
||||||
|
{@target dart}`import 'package:angular2/angular2.dart';`{@endtarget}
|
||||||
|
|
||||||
@cheatsheetItem
|
@cheatsheetItem
|
||||||
syntax:
|
syntax(js ts):
|
||||||
`@Component({...})
|
`@Component({...})
|
||||||
class MyComponent() {}`|`@Component({...})`
|
class MyComponent() {}`|`@Component({...})`
|
||||||
|
syntax(dart):
|
||||||
|
`@Component(...)
|
||||||
|
class MyComponent() {}`|`@Component(...)`
|
||||||
description:
|
description:
|
||||||
Declares that a class is a component and provides metadata about the component.
|
Declares that a class is a component and provides metadata about the component.
|
||||||
|
|
||||||
@cheatsheetItem
|
@cheatsheetItem
|
||||||
syntax:
|
syntax(js ts):
|
||||||
`@Pipe({...})
|
`@Pipe({...})
|
||||||
class MyPipe() {}`|`@Pipe({...})`
|
class MyPipe() {}`|`@Pipe({...})`
|
||||||
|
syntax(dart):
|
||||||
|
`@Pipe(...)
|
||||||
|
class MyPipe() {}`|`@Pipe(...)`
|
||||||
description:
|
description:
|
||||||
Declares that a class is a pipe and provides metadata about the pipe.
|
Declares that a class is a pipe and provides metadata about the pipe.
|
||||||
|
|
||||||
@cheatsheetItem
|
@cheatsheetItem
|
||||||
syntax:
|
syntax(js ts):
|
||||||
|
`@Injectable()
|
||||||
|
class MyService() {}`|`@Injectable()`
|
||||||
|
syntax(dart):
|
||||||
`@Injectable()
|
`@Injectable()
|
||||||
class MyService() {}`|`@Injectable()`
|
class MyService() {}`|`@Injectable()`
|
||||||
description:
|
description:
|
||||||
Declares that a class has dependencies that should be injected into the constructor when the dependency
|
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.
|
||||||
|
@ -2,7 +2,8 @@
|
|||||||
Dependency injection configuration
|
Dependency injection configuration
|
||||||
@cheatsheetIndex 9
|
@cheatsheetIndex 9
|
||||||
@description
|
@description
|
||||||
`import {provide} from 'angular2/angular2';`
|
{@target js ts}`import {provide} from 'angular2/angular2';`{@endtarget}
|
||||||
|
{@target dart}`import 'package:angular2/angular2.dart';`{@endtarget}
|
||||||
|
|
||||||
@cheatsheetItem
|
@cheatsheetItem
|
||||||
syntax:
|
syntax:
|
||||||
|
@ -2,7 +2,8 @@
|
|||||||
Class field decorators for directives and components
|
Class field decorators for directives and components
|
||||||
@cheatsheetIndex 7
|
@cheatsheetIndex 7
|
||||||
@description
|
@description
|
||||||
`import {Input, ...} from 'angular2/angular2';`
|
{@target js ts}`import {Input, ...} from 'angular2/angular2';`{@endtarget}
|
||||||
|
{@target dart}`import 'package:angular2/angular2.dart';`{@endtarget}
|
||||||
|
|
||||||
@cheatsheetItem
|
@cheatsheetItem
|
||||||
syntax:
|
syntax:
|
||||||
@ -59,4 +60,4 @@ Binds the first result of the component view query (myPredicate) to the myChildC
|
|||||||
syntax:
|
syntax:
|
||||||
`@ViewChildren(myPredicate) myChildComponents;`|`@ViewChildren(myPredicate)`
|
`@ViewChildren(myPredicate) myChildComponents;`|`@ViewChildren(myPredicate)`
|
||||||
description:
|
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.
|
||||||
|
@ -2,7 +2,8 @@
|
|||||||
Directive configuration
|
Directive configuration
|
||||||
@cheatsheetIndex 5
|
@cheatsheetIndex 5
|
||||||
@description
|
@description
|
||||||
`@Directive({ property1: value1, ... }) )`
|
{@target js ts}`@Directive({ property1: value1, ... })`{@endtarget}
|
||||||
|
{@target dart}`@Directive(property1: value1, ...)`{@endtarget}
|
||||||
|
|
||||||
@cheatsheetItem
|
@cheatsheetItem
|
||||||
syntax:
|
syntax:
|
||||||
@ -17,4 +18,4 @@ Does not support parent-child relationship selectors.
|
|||||||
syntax:
|
syntax:
|
||||||
`providers: [MyService, provide(...)]`|`providers:`
|
`providers: [MyService, provide(...)]`|`providers:`
|
||||||
description:
|
description:
|
||||||
Array of dependency injection providers for this directive and its children.
|
Array of dependency injection providers for this directive and its children.
|
||||||
|
@ -2,10 +2,11 @@
|
|||||||
Forms
|
Forms
|
||||||
@cheatsheetIndex 3
|
@cheatsheetIndex 3
|
||||||
@description
|
@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
|
@cheatsheetItem
|
||||||
syntax:
|
syntax:
|
||||||
`<input [(ng-model)]="userName">`|`[(ng-model)]`
|
`<input [(ng-model)]="userName">`|`[(ng-model)]`
|
||||||
description:
|
description:
|
||||||
Provides two-way data-binding, parsing and validation for form controls.
|
Provides two-way data-binding, parsing and validation for form controls.
|
||||||
|
@ -5,8 +5,10 @@ Directive and component change detection and lifecycle hooks
|
|||||||
(implemented as class methods)
|
(implemented as class methods)
|
||||||
|
|
||||||
@cheatsheetItem
|
@cheatsheetItem
|
||||||
syntax:
|
syntax(js ts):
|
||||||
`constructor(myService: MyService, ...) { ... }`|`constructor(myService: MyService, ...)`
|
`constructor(myService: MyService, ...) { ... }`|`constructor(myService: MyService, ...)`
|
||||||
|
syntax(dart):
|
||||||
|
`MyAppComponent(MyService myService, ...) { ... }`|`MyAppComponent(MyService myService, ...)`
|
||||||
description:
|
description:
|
||||||
The class constructor is called before any other lifecycle hook. Use it to inject dependencies, but avoid any serious work here.
|
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:
|
syntax:
|
||||||
`ngOnDestroy() { ... }`|`ngOnDestroy()`
|
`ngOnDestroy() { ... }`|`ngOnDestroy()`
|
||||||
description:
|
description:
|
||||||
Called once, before the instance is destroyed.
|
Called once, before the instance is destroyed.
|
||||||
|
@ -2,17 +2,22 @@
|
|||||||
Routing and navigation
|
Routing and navigation
|
||||||
@cheatsheetIndex 10
|
@cheatsheetIndex 10
|
||||||
@description
|
@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
|
@cheatsheetItem
|
||||||
syntax:
|
syntax(js ts):
|
||||||
`@RouteConfig([
|
`@RouteConfig([
|
||||||
{ path: '/:myParam', component: MyComponent, as: 'MyCmp' },
|
{ path: '/:myParam', component: MyComponent, as: 'MyCmp' },
|
||||||
{ path: '/staticPath', component: ..., as: ...},
|
{ path: '/staticPath', component: ..., as: ...},
|
||||||
{ path: '/*wildCardParam', component: ..., as: ...}
|
{ path: '/*wildCardParam', component: ..., as: ...}
|
||||||
])
|
])
|
||||||
class MyComponent() {}`|`@RouteConfig`
|
class MyComponent() {}`|`@RouteConfig`
|
||||||
|
syntax(dart):
|
||||||
|
`@RouteConfig(const [
|
||||||
|
const Route(path: '/:myParam', component: MyComponent, name: 'MyCmp' ),
|
||||||
|
])`
|
||||||
description:
|
description:
|
||||||
Configures routes for the decorated component. Supports static, parameterized and wildcard routes.
|
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
|
@cheatsheetItem
|
||||||
syntax:
|
syntax(js ts):
|
||||||
`@CanActivate(() => { ... })class MyComponent() {}`|`@CanActivate`
|
`@CanActivate(() => { ... })class MyComponent() {}`|`@CanActivate`
|
||||||
|
syntax(dart):
|
||||||
|
`@CanActivate(() => ...)class MyComponent() {}`|`@CanActivate`
|
||||||
description:
|
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.
|
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:
|
syntax:
|
||||||
`routerOnDeactivate(nextInstruction, prevInstruction) { ... }`|`routerOnDeactivate`
|
`routerOnDeactivate(nextInstruction, prevInstruction) { ... }`|`routerOnDeactivate`
|
||||||
description:
|
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.
|
||||||
|
Loading…
x
Reference in New Issue
Block a user