honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

docs(cheatsheet): update for rc5

This commit is contained in:
Jesús Rodríguez 2016-08-09 02:25:42 +02:00
parent d1f4222c83
commit f08257ff4a
6 changed files with 131 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
modules/@angular/docs/cheatsheet/bootstrapping.md
View File

@ -3,14 +3,17 @@ Bootstrapping
@cheatsheetIndex 0
@description
{@target ts}`import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';`{@endtarget}
{@target js}Available from the `ng.platformBrowser` namespace{@endtarget}
{@target js}Available from the `ng.platformBrowserDynamic` namespace{@endtarget}
{@target dart}`import 'package:angular2/platform/browser.dart';`{@endtarget}
@cheatsheetItem
syntax(ts dart):
`platformBrowserDynamic().bootstrapModule(MyAppModule);`|`platformBrowserDynamic().bootstrapModule`
syntax(js):
`document.addEventListener('DOMContentLoaded', function () {
ng.platformBrowser.platformBrowserDynamic().bootstrapModuleDynamic(MyAppModule);`|`platformBrowserDynamic().bootstrapModule`
`document.addEventListener('DOMContentLoaded', function() {
ng.platformBrowserDynamic
.platformBrowserDynamic()
.bootstrapModule(app.AppModule);
});`|`platformBrowserDynamic().bootstrapModule`
description:
Bootstraps an application defined as MyAppModule ng module using the Just in Time compiler.{@target js}Must be wrapped in the event listener to fire when the page loads.{@endtarget}
Bootstraps an application defined as AppModule ng module using the Just in Time compiler.{@target js}Must be wrapped in the event listener to fire when the page loads.{@endtarget}

4
modules/@angular/docs/cheatsheet/built-in-directives.md
View File

@ -2,8 +2,8 @@
Built-in directives
@cheatsheetIndex 3
@description
{@target ts}`import {NgIf, ...} from '@angular/common';`{@endtarget}
{@target js}Available from the `ng.common` namespace{@endtarget}
{@target ts}`import { CommonModule } from '@angular/common';`{@endtarget}
{@target js}Available from the `ng.common.CommonModule` namespace{@endtarget}
{@target dart}Available using `platform_directives` in pubspec{@endtarget}
@cheatsheetItem

2
modules/@angular/docs/cheatsheet/class-decorators.md
View File

@ -2,7 +2,7 @@
Class decorators
@cheatsheetIndex 5
@description
{@target ts}`import {Directive, ...} from '@angular/core';`{@endtarget}
{@target ts}`import { Directive, ... } from '@angular/core';`{@endtarget}
{@target js}Available from the `ng.core` namespace{@endtarget}
{@target dart}`import 'package:angular2/core.dart';`{@endtarget}

2
modules/@angular/docs/cheatsheet/directive-and-component-decorators.md
View File

@ -2,7 +2,7 @@
Class field decorators for directives and components
@cheatsheetIndex 8
@description
{@target ts}`import {Input, ...} from '@angular/core';`{@endtarget}
{@target ts}`import { Input, ... } from '@angular/core';`{@endtarget}
{@target js}Available from the `ng.core` namespace{@endtarget}
{@target dart}`import 'package:angular2/core.dart';`{@endtarget}

2
modules/@angular/docs/cheatsheet/forms.md
View File

@ -2,7 +2,7 @@
Forms
@cheatsheetIndex 4
@description
{@target ts}`import {FormsModule} from '@angular/forms';`{@endtarget}
{@target ts}`import { FormsModule } from '@angular/forms';`{@endtarget}
{@target js}Available from `ng.forms.FormsModule`{@endtarget}
{@target dart}Available using `platform_directives` in pubspec{@endtarget}

166
modules/@angular/docs/cheatsheet/routing.md
View File

@ -2,33 +2,40 @@
Routing and navigation
@cheatsheetIndex 11
@description
{@target ts}`import {provideRouter, RouteConfig, ROUTER_DIRECTIVES, ...} from '@angular/router';`{@endtarget}
{@target ts}`import { Routes, RouterModule, ... } from '@angular/router';`{@endtarget}
{@target js}Available from the `ng.router` namespace{@endtarget}
{@target dart}`import 'package:angular2/router.dart';`{@endtarget}
@cheatsheetItem
syntax(ts):
`@RouteConfig([
{ path: '/:myParam', component: MyComponent, name: 'MyCmp' },
{ path: '/staticPath', component: ..., name: ...},
{ path: '/*wildCardParam', component: ..., name: ...}
])
class MyComponent() {}`|`@RouteConfig`
`let routes: Routes = [
{ path: '', HomeComponent },
{ path: 'path/:routeParam', component: MyComponent },
{ path: 'staticPath', component: ... },
{ path: '**', component: ... },
{ path: 'oldPath', redirectTo: '/staticPath' },
{ path: ..., component: ..., data: { message: 'Custom' } }
]);
provideRouter(routes);`|`Routes`
syntax(js):
`var MyComponent = ng.router.RouteConfig([
{ path: '/:myParam', component: MyComponent, name: 'MyCmp' },
{ path: '/staticPath', component: ..., name: ...},
{ path: '/*wildCardParam', component: ..., name: ...}
]).Class({
constructor: function() {}
});`|`ng.router.RouteConfig`
`var routes = [
{ path: '', HomeComponent },
{ path: ':routeParam', component: MyComponent },
{ path: 'staticPath', component: ... },
{ path: '**', component: ... },
{ path: 'oldPath', redirectTo: '/staticPath' },
{ path: ..., component: ..., data: { message: 'Custom' } }
]);
ng.router.provideRouter(routes)`|`ng.router.Routes`
syntax(dart):
`@RouteConfig(const [
const Route(path: '/:myParam', component: MyComponent, name: 'MyCmp' ),
const Route(path: 'path', component: MyComponent, name: 'MyCmp' ),
])`|`@RouteConfig`
description:
Configures routes for the decorated component. Supports static, parameterized, and wildcard routes.
Configures routes for the application. Supports static, parameterized, redirect and wildcard routes. Also supports custom route data and resolve.
@cheatsheetItem
@ -39,63 +46,128 @@ Marks the location to load the component of the active route.
@cheatsheetItem
syntax:
`<a [routerLink]="[ '/MyCmp', {myParam: 'value' } ]">`|`[routerLink]`
syntax(ts js):
`
<a [routerLink]="[ '/path', routeParam ]">
<a [routerLink]="[ '/path', { matrixParam: 'value' } ]">
<a [routerLink]="[ '/path' ]" [queryParams]="{ page: 1 }">
<a [routerLink]="[ '/path' ]" fragment="anchor">
`|`[routerLink]`
syntax(dart):
`<a [routerLink]="[ '/MyCmp', { routeParam: 'value' } ]">Link</a>`|`[routerLink]`
description:
Creates a link to a different view based on a route instruction consisting of a route name and optional parameters. The route name matches the as property of a configured route. Add the '/' prefix to navigate to a root route; add the './' prefix for a child route.
Creates a link to a different view based on a route instruction consisting of a route path, required and optional parameters, query parameters and a fragment. Add the '/' prefix to navigate to a root route; add the './' prefix for a child route; add the '../sibling' prefix for a sibling or parent route.
@cheatsheetItem
syntax(ts js):
`<a [routerLink]="[ '/path' ]" routerLinkActive="active">`
syntax(dart):
`<a [routerLink]="[ '/MyCmp', { myParam: 'value' } ]">`|`[routerLink]`
description:
The provided class(es) will be added to the element when the routerLink becomes the current active route.
@cheatsheetItem
syntax(ts):
`class CanActivateGuard implements CanActivate {
canActivate(
route: ActivatedRouteSnapshot,
state: RouterStateSnapshot
): Observable<boolean> | boolean { ... }
}
{ path: ..., canActivate: [CanActivateGuard] }`|`CanActivate`
syntax(js):
`var CanActivateGuard = ng.core.Class({
canActivate: function(route, state) {
// return Observable boolean or boolean
}
});
{ path: ..., canActivate: [CanActivateGuard] }`|`CanActivate`
syntax(dart):
`@CanActivate(() => ...)class MyComponent() {}`|`@CanActivate`
description:
{@target js ts}An interface for defining a class that the router should call first to determine if it should activate this component. Should return a boolean or a Observable that resolves a boolean{@endtarget}
{@target dart}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 future.{@endtarget}
@cheatsheetItem
syntax(ts):
`class CanDeactivateGuard implements CanDeactivate<T> {
canDeactivate(
component: T,
route: ActivatedRouteSnapshot,
state: RouterStateSnapshot
): Observable<boolean> | boolean { ... }
}
{ path: ..., canDeactivate: [CanDeactivateGuard] }`|`CanDeactivate`
syntax(js):
`var CanDeactivateGuard = ng.core.Class({
canDeactivate: function(component, route, state) {
// return Observable boolean or boolean
}
});
{ path: ..., canDeactivate: [CanDeactivateGuard] }`|`CanDeactivate`
syntax(dart):
`routerCanDeactivate(nextInstruction, prevInstruction) { ... }`|`routerCanDeactivate`
description:
{@target js ts}An interface for defining a class that the router should call first to determine if it should deactivate this component after a navigation. Should return a boolean or a Observable that resolves a boolean{@endtarget}
{@target dart}
The router calls the routerCanDeactivate methods (if defined) of every component that would be removed after a navigation. The navigation proceeds if and only if all such methods return true or a future that completes successfully{@endtarget}.
@cheatsheetItem
syntax(ts):
`@CanActivate(() => { ... })class MyComponent() {}`|`@CanActivate`
`class ResolveGuard implements Resolve<T> {
resolve(
route: ActivatedRouteSnapshot,
state: RouterStateSnapshot
): Observable<any> | any { ... }
}
{ path: ..., resolve: [ResolveGuard] }`|`Resolve`
syntax(js):
`var MyComponent = ng.router.CanActivate(function() { ... }).Component({...}).Class({constructor: ...});`|`ng.router.CanActivate(function() { ... })`
`var ResolveGuard = ng.core.Class({
resolve: function(route, state) {
// return Observable value or value
}
});
{ path: ..., resolve: [ResolveGuard] }`|`Resolve`
description:
{@target js ts}An interface for defining a class that the router should call first to resolve route data before rendering the route. Should return a value or an Observable that resolves a value{@endtarget}
@cheatsheetItem
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 {@target js ts}promise{@endtarget}{@target dart}future{@endtarget}.
@cheatsheetItem
syntax(ts dart):
`routerOnActivate(nextInstruction, prevInstruction) { ... }`|`routerOnActivate`
syntax(js):
`routerOnActivate: function(nextInstruction, prevInstruction) { ... }`|`routerOnActivate`
description:
After navigating to a component, the router calls the component's routerOnActivate method (if defined).
{@target dart}After navigating to a component, the router calls the component's routerOnActivate method (if defined).{@endtarget}
@cheatsheetItem
syntax(ts dart):
syntax(dart):
`routerCanReuse(nextInstruction, prevInstruction) { ... }`|`routerCanReuse`
syntax(js):
`routerCanReuse: function(nextInstruction, prevInstruction) { ... }`|`routerCanReuse`
description:
The router calls a component's routerCanReuse method (if defined) to determine whether to reuse the instance or destroy it and create a new instance. Should return a boolean or a {@target js ts}promise{@endtarget}{@target dart}future{@endtarget}.
{@target dart}The router calls a component's routerCanReuse method (if defined) to determine whether to reuse the instance or destroy it and create a new instance. Should return a boolean or a future{@endtarget}.
@cheatsheetItem
syntax(ts dart):
syntax(dart):
`routerOnReuse(nextInstruction, prevInstruction) { ... }`|`routerOnReuse`
syntax(js):
`routerOnReuse: function(nextInstruction, prevInstruction) { ... }`|`routerOnReuse`
description:
The router calls the component's routerOnReuse method (if defined) when it re-uses a component instance.
{@target dart}The router calls the component's routerOnReuse method (if defined) when it re-uses a component instance.{@endtarget}
@cheatsheetItem
syntax(ts dart):
syntax(dart):
`routerCanDeactivate(nextInstruction, prevInstruction) { ... }`|`routerCanDeactivate`
syntax(js):
`routerCanDeactivate: function(nextInstruction, prevInstruction) { ... }`|`routerCanDeactivate`
description:
The router calls the routerCanDeactivate methods (if defined) of every component that would be removed after a navigation. The navigation proceeds if and only if all such methods return true or a {@target js ts}promise that is resolved{@endtarget}{@target dart}future that completes successfully{@endtarget}.
{@target dart}The router calls the routerCanDeactivate methods (if defined) of every component that would be removed after a navigation. The navigation proceeds if and only if all such methods return true or a future that completes successfully.{@endtarget}
@cheatsheetItem
syntax(ts dart):
syntax(dart):
`routerOnDeactivate(nextInstruction, prevInstruction) { ... }`|`routerOnDeactivate`
syntax(js):
`routerOnDeactivate: function(nextInstruction, prevInstruction) { ... }`|`routerOnDeactivate`
description:
Called before the directive is removed as the result of a route change. May return a {@target js ts}promise{@endtarget}{@target dart}future{@endtarget} that pauses removing the directive until the {@target js ts}promise resolves{@endtarget}{@target dart}future completes{@endtarget}.
{@target dart}Called before the directive is removed as the result of a route change. May return a future that pauses removing the directive until the future completes.{@endtarget}