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

docs(router): fix filetree styles

This commit is contained in:
Naomi Black 2015-12-15 11:23:25 -08:00
parent 728659ba71
commit ab90d68240
4 changed files with 1593 additions and 1515 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
public/docs/dart/latest/guide/cheatsheet.json
View File

@ -1,14 +1,32 @@
[ {
"currentEnvironment": "Dart",
"version": {
"raw": "2.0.0-beta.0",
"major": 2,
"minor": 0,
"patch": 0,
"prerelease": [
"local"
],
"build": "sha.323393a",
"version": "2.0.0-local",
"codeName": "snapshot",
"isSnapshot": true,
"full": "2.0.0-local+sha.323393a",
"branch": "master",
"commitSHA": "323393a86201db871c2fbc6dc7bd12229b498d9a"
},
"sections": [
{ {
"name": "Bootstrapping", "name": "Bootstrapping",
"description": "<p>\n<code>import &#39;package:angular2/bootstrap.dart&#39;;</code></p>\n", "description": "<p>\n\n<code>import &#39;package:angular2/bootstrap.dart&#39;;</code></p>\n",
"items": [ "items": [
{ {
"syntax": "bootstrap​(MyAppComponent, [MyService, provide(...)]);", "syntax": "bootstrap​(MyAppComponent, [MyService, provide(...)]);",
"bold": [ "bold": [
"provide" "provide"
], ],
"description": "<p>Bootstraps an application with MyAppComponent as the root component, and\nconfigures the app&#39;s dependency injection providers.</p>\n" "description": "<p>Bootstraps an application with MyAppComponent as the root component and configures the DI providers. </p>\n"
} }
], ],
"index": 0 "index": 0
@ -107,7 +125,7 @@
}, },
{ {
"name": "Built-in directives", "name": "Built-in directives",
"description": "<p>\n<code>import &#39;package:angular2/common.dart&#39;;</code></p>\n", "description": "<p>\n\n<code>import &#39;package:angular2/common.dart&#39;;</code></p>\n",
"items": [ "items": [
{ {
"syntax": "<section *ngIf=\"showSection\">", "syntax": "<section *ngIf=\"showSection\">",
@ -145,7 +163,7 @@
}, },
{ {
"name": "Forms", "name": "Forms",
"description": "<p>\n<code>import &#39;package:angular2/common.dart&#39;;</code></p>\n", "description": "<p>\n\n<code>import &#39;package:angular2/common.dart&#39;;</code></p>\n",
"items": [ "items": [
{ {
"syntax": "<input [(ngModel)]=\"userName\">", "syntax": "<input [(ngModel)]=\"userName\">",
@ -159,7 +177,7 @@
}, },
{ {
"name": "Class decorators", "name": "Class decorators",
"description": "<p>\n<code>import &#39;package:angular2/core.dart&#39;;</code></p>\n", "description": "<p>\n\n<code>import &#39;package:angular2/core.dart&#39;;</code></p>\n",
"items": [ "items": [
{ {
"syntax": "@Component(...)\nclass MyComponent() {}", "syntax": "@Component(...)\nclass MyComponent() {}",
@ -180,14 +198,14 @@
"bold": [ "bold": [
"@Injectable()" "@Injectable()"
], ],
"description": "<p>Declares that a class has dependencies that should be injected into the constructor when the dependency\ninjector is creating an instance of this class.</p>\n" "description": "<p>Declares that a class has dependencies that should be injected into the constructor when the dependency injector is creating an instance of this class.\n\n</p>\n"
} }
], ],
"index": 4 "index": 4
}, },
{ {
"name": "Directive configuration", "name": "Directive configuration",
"description": "<p>\n<code>@Directive(property1: value1, ...)</code></p>\n", "description": "<p>\n\n<code>@Directive(property1: value1, ...)</code></p>\n",
"items": [ "items": [
{ {
"syntax": "selector: '.cool-button:not(a)'", "syntax": "selector: '.cool-button:not(a)'",
@ -208,7 +226,7 @@
}, },
{ {
"name": "Component configuration", "name": "Component configuration",
"description": "<p><code>@Component</code> extends <code>@Directive</code>,\nso the <code>@Directive</code> configuration applies to components as well</p>\n", "description": "<p>\n<code>@Component</code> extends <code>@Directive</code>,\nso the <code>@Directive</code> configuration applies to components as well</p>\n",
"items": [ "items": [
{ {
"syntax": "viewProviders: [MyService, provide(...)]", "syntax": "viewProviders: [MyService, provide(...)]",
@ -252,7 +270,7 @@
}, },
{ {
"name": "Class field decorators for directives and components", "name": "Class field decorators for directives and components",
"description": "<p>\n<code>import &#39;package:angular2/core.dart&#39;;</code></p>\n", "description": "<p>\n\n<code>import &#39;package:angular2/core.dart&#39;;</code></p>\n",
"items": [ "items": [
{ {
"syntax": "@Input() myProperty;", "syntax": "@Input() myProperty;",
@ -315,7 +333,7 @@
}, },
{ {
"name": "Directive and component change detection and lifecycle hooks", "name": "Directive and component change detection and lifecycle hooks",
"description": "<p>(implemented as class methods)</p>\n", "description": "<p>(implemented as class methods)\n</p>\n",
"items": [ "items": [
{ {
"syntax": "MyAppComponent(MyService myService, ...) { ... }", "syntax": "MyAppComponent(MyService myService, ...) { ... }",
@ -385,7 +403,7 @@
}, },
{ {
"name": "Dependency injection configuration", "name": "Dependency injection configuration",
"description": "<p>\n<code>import &#39;package:angular2/core.dart&#39;;</code></p>\n", "description": "<p>\n\n<code>import &#39;package:angular2/core.dart&#39;;</code></p>\n",
"items": [ "items": [
{ {
"syntax": "provide(MyService, {useClass: MyMockService})", "syntax": "provide(MyService, {useClass: MyMockService})",
@ -416,7 +434,7 @@
}, },
{ {
"name": "Routing and navigation", "name": "Routing and navigation",
"description": "<p>\n<code>import &#39;package:angular2/router.dart&#39;;</code></p>\n", "description": "<p>\n\n<code>import &#39;package:angular2/router.dart&#39;;</code></p>\n",
"items": [ "items": [
{ {
"syntax": "@RouteConfig(const [\n const Route(path: '/:myParam', component: MyComponent, name: 'MyCmp' ),\n])", "syntax": "@RouteConfig(const [\n const Route(path: '/:myParam', component: MyComponent, name: 'MyCmp' ),\n])",
@ -484,4 +502,5 @@
], ],
"index": 10 "index": 10
} }
] ]
}

163
public/docs/js/latest/guide/cheatsheet.json
View File

@ -1,14 +1,32 @@
[ {
"currentEnvironment": "JavaScript",
"version": {
"raw": "2.0.0-beta.0",
"major": 2,
"minor": 0,
"patch": 0,
"prerelease": [
"local"
],
"build": "sha.323393a",
"version": "2.0.0-local",
"codeName": "snapshot",
"isSnapshot": true,
"full": "2.0.0-local+sha.323393a",
"branch": "master",
"commitSHA": "323393a86201db871c2fbc6dc7bd12229b498d9a"
},
"sections": [
{ {
"name": "Bootstrapping", "name": "Bootstrapping",
"description": "<p><code>import {bootstrap} from &#39;angular2/platform/browser&#39;;</code>\n</p>\n", "description": "<p>\nAvailable from the <code>ng.platform.browser</code> namespace.\n</p>\n",
"items": [ "items": [
{ {
"syntax": "bootstrap​(MyAppComponent, [MyService, provide(...)]);", "syntax": "document.addEventListener('DOMContentLoaded', function () {\n ng.platform.browser.bootstrap(MyAppComponent,\n [MyService, ng.core.provide(...)]);\n});",
"bold": [ "bold": [
"provide" "provide"
], ],
"description": "<p>Bootstraps an application with MyAppComponent as the root component, and\nconfigures the app&#39;s dependency injection providers.</p>\n" "description": "<p>Bootstraps an application with MyAppComponent as the root component and configures the DI providers. Must be wrapped in the event listener to fire when the page loads.</p>\n"
} }
], ],
"index": 0 "index": 0
@ -107,7 +125,7 @@
}, },
{ {
"name": "Built-in directives", "name": "Built-in directives",
"description": "<p><code>import {NgIf, ...} from &#39;angular2/common&#39;;</code>\n</p>\n", "description": "<p>\nAvailable from the <code>ng.common</code> namespace\n</p>\n",
"items": [ "items": [
{ {
"syntax": "<section *ngIf=\"showSection\">", "syntax": "<section *ngIf=\"showSection\">",
@ -145,7 +163,7 @@
}, },
{ {
"name": "Forms", "name": "Forms",
"description": "<p><code>import {FORM_DIRECTIVES} from &#39;angular2/common&#39;;</code>\n</p>\n", "description": "<p>\nAvailable from <code>ng.common.FORM_DIRECTIVES</code>\n</p>\n",
"items": [ "items": [
{ {
"syntax": "<input [(ngModel)]=\"userName\">", "syntax": "<input [(ngModel)]=\"userName\">",
@ -159,35 +177,35 @@
}, },
{ {
"name": "Class decorators", "name": "Class decorators",
"description": "<p><code>import {Directive, ...} from &#39;angular2/core&#39;;</code>\n</p>\n", "description": "<p>\nAvailable from the <code>ng.core</code> namespace\n</p>\n",
"items": [ "items": [
{ {
"syntax": "@Component({...})\nclass MyComponent() {}", "syntax": "var MyComponent = ng.core.Component({...}).Class({...})",
"bold": [ "bold": [
"@Component({...})" "ng.core.Component({...})"
], ],
"description": "<p>Declares that a class is a component and provides metadata about the component.</p>\n" "description": "<p>Declares that a class is a component and provides metadata about the component.</p>\n"
}, },
{ {
"syntax": "@Pipe({...})\nclass MyPipe() {}", "syntax": "var MyPipe = ng.core.Pipe({...}).Class({...})",
"bold": [ "bold": [
"@Pipe({...})" "ng.core.Pipe({...})"
], ],
"description": "<p>Declares that a class is a pipe and provides metadata about the pipe.</p>\n" "description": "<p>Declares that a class is a pipe and provides metadata about the pipe.</p>\n"
}, },
{ {
"syntax": "@Injectable()\nclass MyService() {}", "syntax": "var OtherService = ng.core.Class({constructor: function() { }});\nvar MyService = ng.core.Class({constructor: [OtherService, function(otherService) { }]});",
"bold": [ "bold": [
"@Injectable()" "var MyService = ng.core.Class({constructor: [OtherService, function(otherService) { }]});"
], ],
"description": "<p>Declares that a class has dependencies that should be injected into the constructor when the dependency\ninjector is creating an instance of this class.</p>\n" "description": "<p>\n\nDeclares a service to inject into a class by providing an array with the services with the final item being the function which will receive the injected services.\n</p>\n"
} }
], ],
"index": 4 "index": 4
}, },
{ {
"name": "Directive configuration", "name": "Directive configuration",
"description": "<p><code>@Directive({ property1: value1, ... })</code>\n</p>\n", "description": "<p>\n<code>ng.core.Directive({ property1: value1, ... }).Class({...})</code>\n</p>\n",
"items": [ "items": [
{ {
"syntax": "selector: '.cool-button:not(a)'", "syntax": "selector: '.cool-button:not(a)'",
@ -197,7 +215,7 @@
"description": "<p>Specifies a CSS selector that identifies this directive within a template. Supported selectors include <code>element</code>,\n<code>[attribute]</code>, <code>.class</code>, and <code>:not()</code>.</p>\n<p>Does not support parent-child relationship selectors.</p>\n" "description": "<p>Specifies a CSS selector that identifies this directive within a template. Supported selectors include <code>element</code>,\n<code>[attribute]</code>, <code>.class</code>, and <code>:not()</code>.</p>\n<p>Does not support parent-child relationship selectors.</p>\n"
}, },
{ {
"syntax": "providers: [MyService, provide(...)]", "syntax": "providers: [MyService, ng.core.provide(...)]",
"bold": [ "bold": [
"providers:" "providers:"
], ],
@ -208,10 +226,10 @@
}, },
{ {
"name": "Component configuration", "name": "Component configuration",
"description": "<p><code>@Component</code> extends <code>@Directive</code>,\nso the <code>@Directive</code> configuration applies to components as well</p>\n", "description": "<p><code>ng.core.Component</code> extends <code>ng.core.Directive</code>,\nso the <code>ng.core.Directive</code> configuration applies to components as well\n</p>\n",
"items": [ "items": [
{ {
"syntax": "viewProviders: [MyService, provide(...)]", "syntax": "viewProviders: [MyService, ng.core.provide(...)]",
"bold": [ "bold": [
"viewProviders:" "viewProviders:"
], ],
@ -252,61 +270,69 @@
}, },
{ {
"name": "Class field decorators for directives and components", "name": "Class field decorators for directives and components",
"description": "<p><code>import {Input, ...} from &#39;angular2/core&#39;;</code>\n</p>\n", "description": "<p>\nAvailable from the <code>ng.core</code> namespace\n</p>\n",
"items": [ "items": [
{ {
"syntax": "@Input() myProperty;", "syntax": "ng.core.Input(myProperty, myComponent);",
"bold": [ "bold": [
"@Input()" "ng.core.Input(",
");"
], ],
"description": "<p>Declares an input property that we can update via property binding (e.g.\n<code>&lt;my-cmp [my-property]=&quot;someExpression&quot;&gt;</code>).</p>\n" "description": "<p>Declares an input property that we can update via property binding (e.g.\n<code>&lt;my-cmp [my-property]=&quot;someExpression&quot;&gt;</code>).</p>\n"
}, },
{ {
"syntax": "@Output() myEvent = new EventEmitter();", "syntax": "myEvent = new ng.core.EventEmitter(); ng.core.Output(myEvent, myComponent);",
"bold": [ "bold": [
"@Output()" "ng.core.Output(",
");"
], ],
"description": "<p>Declares an output property that fires events to which we can subscribe with an event binding (e.g. <code>&lt;my-cmp (my-event)=&quot;doSomething()&quot;&gt;</code>).</p>\n" "description": "<p>Declares an output property that fires events to which we can subscribe with an event binding (e.g. <code>&lt;my-cmp (my-event)=&quot;doSomething()&quot;&gt;</code>).</p>\n"
}, },
{ {
"syntax": "@HostBinding('[class.valid]') isValid;", "syntax": "ng.core.HostBinding('[class.valid]', 'isValid', myComponent);",
"bold": [ "bold": [
"@HostBinding('[class.valid]')" "ng.core.HostBinding('[class.valid]', 'isValid'",
");"
], ],
"description": "<p>Binds a host element property (e.g. CSS class valid) to directive/component property (e.g. isValid).</p>\n" "description": "<p>Binds a host element property (e.g. CSS class valid) to directive/component property (e.g. isValid).</p>\n"
}, },
{ {
"syntax": "@HostListener('click', ['$event']) onClick(e) {...}", "syntax": "ng.core.HostListener('click', ['$event'], onClick(e) {...}, myComponent);",
"bold": [ "bold": [
"@HostListener('click', ['$event'])" "ng.core.HostListener('click', ['$event'], onClick(e)",
");"
], ],
"description": "<p>Subscribes to a host element event (e.g. click) with a directive/component method (e.g. onClick), optionally passing an argument ($event).</p>\n" "description": "<p>Subscribes to a host element event (e.g. click) with a directive/component method (e.g. onClick), optionally passing an argument ($event).</p>\n"
}, },
{ {
"syntax": "@ContentChild(myPredicate) myChildComponent;", "syntax": "ng.core.ContentChild(myPredicate, 'myChildComponent', myComponent);",
"bold": [ "bold": [
"@ContentChild(myPredicate)" "ng.core.ContentChild(myPredicate,",
");"
], ],
"description": "<p>Binds the first result of the component content query (myPredicate) to the myChildComponent property of the class.</p>\n" "description": "<p>Binds the first result of the component content query (myPredicate) to the myChildComponent property of the class.</p>\n"
}, },
{ {
"syntax": "@ContentChildren(myPredicate) myChildComponents;", "syntax": "ng.core.ContentChildren(myPredicate, 'myChildComponents', myComponent);",
"bold": [ "bold": [
"@ContentChildren(myPredicate)" "ng.core.ContentChildren(myPredicate,",
");"
], ],
"description": "<p>Binds the results of the component content query (myPredicate) to the myChildComponents property of the class.</p>\n" "description": "<p>Binds the results of the component content query (myPredicate) to the myChildComponents property of the class.</p>\n"
}, },
{ {
"syntax": "@ViewChild(myPredicate) myChildComponent;", "syntax": "ng.core.ViewChild(myPredicate, 'myChildComponent', myComponent);",
"bold": [ "bold": [
"@ViewChild(myPredicate)" "ng.core.ViewChild(myPredicate,",
");"
], ],
"description": "<p>Binds the first result of the component view query (myPredicate) to the myChildComponent property of the class. Not available for directives.</p>\n" "description": "<p>Binds the first result of the component view query (myPredicate) to the myChildComponent property of the class. Not available for directives.</p>\n"
}, },
{ {
"syntax": "@ViewChildren(myPredicate) myChildComponents;", "syntax": "ng.core.ViewChildren(myPredicate, 'myChildComponents', myComponent);",
"bold": [ "bold": [
"@ViewChildren(myPredicate)" "ng.core.ViewChildren(myPredicate,",
");"
], ],
"description": "<p>Binds the results of the component view query (myPredicate) to the myChildComponents property of the class. Not available for directives.</p>\n" "description": "<p>Binds the results of the component view query (myPredicate) to the myChildComponents property of the class. Not available for directives.</p>\n"
} }
@ -315,68 +341,68 @@
}, },
{ {
"name": "Directive and component change detection and lifecycle hooks", "name": "Directive and component change detection and lifecycle hooks",
"description": "<p>(implemented as class methods)</p>\n", "description": "<p>\n(implemented as component properties)</p>\n",
"items": [ "items": [
{ {
"syntax": "constructor(myService: MyService, ...) { ... }", "syntax": "constructor: function(MyService, ...) { ... }",
"bold": [ "bold": [
"constructor(myService: MyService, ...)" "constructor: function(MyService, ...)"
], ],
"description": "<p>The class constructor is called before any other lifecycle hook. Use it to inject dependencies, but avoid any serious work here.</p>\n" "description": "<p>The class constructor is called before any other lifecycle hook. Use it to inject dependencies, but avoid any serious work here.</p>\n"
}, },
{ {
"syntax": "ngOnChanges(changeRecord) { ... }", "syntax": "ngOnChanges: function(changeRecord) { ... }",
"bold": [ "bold": [
"ngOnChanges(changeRecord)" "ngOnChanges: function(changeRecord)"
], ],
"description": "<p>Called after every change to input properties and before processing content or child views.</p>\n" "description": "<p>Called after every change to input properties and before processing content or child views.</p>\n"
}, },
{ {
"syntax": "ngOnInit() { ... }", "syntax": "ngOnInit: function() { ... }",
"bold": [ "bold": [
"ngOnInit()" "ngOnInit: function()"
], ],
"description": "<p>Called after the constructor, initializing input properties, and the first call to ngOnChanges.</p>\n" "description": "<p>Called after the constructor, initializing input properties, and the first call to ngOnChanges.</p>\n"
}, },
{ {
"syntax": "ngDoCheck() { ... }", "syntax": "ngDoCheck: function() { ... }",
"bold": [ "bold": [
"ngDoCheck()" "ngDoCheck: function()"
], ],
"description": "<p>Called every time that the input properties of a component or a directive are checked. Use it to extend change detection by performing a custom check.</p>\n" "description": "<p>Called every time that the input properties of a component or a directive are checked. Use it to extend change detection by performing a custom check.</p>\n"
}, },
{ {
"syntax": "ngAfterContentInit() { ... }", "syntax": "ngAfterContentInit: function() { ... }",
"bold": [ "bold": [
"ngAfterContentInit()" "ngAfterContentInit: function()"
], ],
"description": "<p>Called after ngOnInit when the component&#39;s or directive&#39;s content has been initialized.</p>\n" "description": "<p>Called after ngOnInit when the component&#39;s or directive&#39;s content has been initialized.</p>\n"
}, },
{ {
"syntax": "ngAfterContentChecked() { ... }", "syntax": "ngAfterContentChecked: function() { ... }",
"bold": [ "bold": [
"ngAfterContentChecked()" "ngAfterContentChecked: function()"
], ],
"description": "<p>Called after every check of the component&#39;s or directive&#39;s content.</p>\n" "description": "<p>Called after every check of the component&#39;s or directive&#39;s content.</p>\n"
}, },
{ {
"syntax": "ngAfterViewInit() { ... }", "syntax": "ngAfterViewInit: function() { ... }",
"bold": [ "bold": [
"ngAfterViewInit()" "ngAfterViewInit: function()"
], ],
"description": "<p>Called after ngAfterContentInit when the component&#39;s view has been initialized. Applies to components only.</p>\n" "description": "<p>Called after ngAfterContentInit when the component&#39;s view has been initialized. Applies to components only.</p>\n"
}, },
{ {
"syntax": "ngAfterViewChecked() { ... }", "syntax": "ngAfterViewChecked: function() { ... }",
"bold": [ "bold": [
"ngAfterViewChecked()" "ngAfterViewChecked: function()"
], ],
"description": "<p>Called after every check of the component&#39;s view. Applies to components only.</p>\n" "description": "<p>Called after every check of the component&#39;s view. Applies to components only.</p>\n"
}, },
{ {
"syntax": "ngOnDestroy() { ... }", "syntax": "ngOnDestroy: function() { ... }",
"bold": [ "bold": [
"ngOnDestroy()" "ngOnDestroy: function()"
], ],
"description": "<p>Called once, before the instance is destroyed.</p>\n" "description": "<p>Called once, before the instance is destroyed.</p>\n"
} }
@ -385,10 +411,10 @@
}, },
{ {
"name": "Dependency injection configuration", "name": "Dependency injection configuration",
"description": "<p><code>import {provide} from &#39;angular2/core&#39;;</code>\n</p>\n", "description": "<p>\nAvailable from the <code>ng.core</code> namespace\n</p>\n",
"items": [ "items": [
{ {
"syntax": "provide(MyService, {useClass: MyMockService})", "syntax": "ng.core.provide(MyService, {useClass: MyMockService})",
"bold": [ "bold": [
"provide", "provide",
"useClass" "useClass"
@ -396,7 +422,7 @@
"description": "<p>Sets or overrides the provider for MyService to the MyMockService class.</p>\n" "description": "<p>Sets or overrides the provider for MyService to the MyMockService class.</p>\n"
}, },
{ {
"syntax": "provide(MyService, {useFactory: myFactory})", "syntax": "ng.core.provide(MyService, {useFactory: myFactory})",
"bold": [ "bold": [
"provide", "provide",
"useFactory" "useFactory"
@ -416,12 +442,12 @@
}, },
{ {
"name": "Routing and navigation", "name": "Routing and navigation",
"description": "<p><code>import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, ...} from &#39;angular2/router&#39;;</code>\n</p>\n", "description": "<p>\nAvailable from the <code>ng.router</code> namespace\n</p>\n",
"items": [ "items": [
{ {
"syntax": "@RouteConfig([\n { path: '/:myParam', component: MyComponent, as: 'MyCmp' },\n { path: '/staticPath', component: ..., as: ...},\n { path: '/*wildCardParam', component: ..., as: ...}\n])\nclass MyComponent() {}", "syntax": "var MyComponent = ng.router.RouteConfig([\n { path: '/:myParam', component: MyComponent, as: 'MyCmp' },\n { path: '/staticPath', component: ..., as: ...},\n { path: '/*wildCardParam', component: ..., as: ...}\n]).Class({\n constructor: function() {}\n});",
"bold": [ "bold": [
"@RouteConfig" "ng.router.RouteConfig"
], ],
"description": "<p>Configures routes for the decorated component. Supports static, parameterized, and wildcard routes.</p>\n" "description": "<p>Configures routes for the decorated component. Supports static, parameterized, and wildcard routes.</p>\n"
}, },
@ -440,42 +466,42 @@
"description": "<p>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 &#39;/&#39; prefix to navigate to a root route; add the &#39;./&#39; prefix for a child route.</p>\n" "description": "<p>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 &#39;/&#39; prefix to navigate to a root route; add the &#39;./&#39; prefix for a child route.</p>\n"
}, },
{ {
"syntax": "@CanActivate(() => { ... })class MyComponent() {}", "syntax": "var MyComponent = ng.router.CanActivate(function() { ... }).Component({...}).Class({constructor: ...});",
"bold": [ "bold": [
"@CanActivate" "ng.router.CanActivate(function() { ... })"
], ],
"description": "<p>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.</p>\n" "description": "<p>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.</p>\n"
}, },
{ {
"syntax": "routerOnActivate(nextInstruction, prevInstruction) { ... }", "syntax": "routerOnActivate: function(nextInstruction, prevInstruction) { ... }",
"bold": [ "bold": [
"routerOnActivate" "routerOnActivate"
], ],
"description": "<p>After navigating to a component, the router calls the component&#39;s routerOnActivate method (if defined).</p>\n" "description": "<p>After navigating to a component, the router calls the component&#39;s routerOnActivate method (if defined).</p>\n"
}, },
{ {
"syntax": "routerCanReuse(nextInstruction, prevInstruction) { ... }", "syntax": "routerCanReuse: function(nextInstruction, prevInstruction) { ... }",
"bold": [ "bold": [
"routerCanReuse" "routerCanReuse"
], ],
"description": "<p>The router calls a component&#39;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 promise.</p>\n" "description": "<p>The router calls a component&#39;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 promise.</p>\n"
}, },
{ {
"syntax": "routerOnReuse(nextInstruction, prevInstruction) { ... }", "syntax": "routerOnReuse: function(nextInstruction, prevInstruction) { ... }",
"bold": [ "bold": [
"routerOnReuse" "routerOnReuse"
], ],
"description": "<p>The router calls the component&#39;s routerOnReuse method (if defined) when it re-uses a component instance.</p>\n" "description": "<p>The router calls the component&#39;s routerOnReuse method (if defined) when it re-uses a component instance.</p>\n"
}, },
{ {
"syntax": "routerCanDeactivate(nextInstruction, prevInstruction) { ... }", "syntax": "routerCanDeactivate: function(nextInstruction, prevInstruction) { ... }",
"bold": [ "bold": [
"routerCanDeactivate" "routerCanDeactivate"
], ],
"description": "<p>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 promise that is resolved.</p>\n" "description": "<p>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 promise that is resolved.</p>\n"
}, },
{ {
"syntax": "routerOnDeactivate(nextInstruction, prevInstruction) { ... }", "syntax": "routerOnDeactivate: function(nextInstruction, prevInstruction) { ... }",
"bold": [ "bold": [
"routerOnDeactivate" "routerOnDeactivate"
], ],
@ -484,4 +510,5 @@
], ],
"index": 10 "index": 10
} }
] ]
}

47
public/docs/ts/latest/guide/cheatsheet.json
View File

@ -1,14 +1,32 @@
[ {
"currentEnvironment": "TypeScript",
"version": {
"raw": "2.0.0-beta.0",
"major": 2,
"minor": 0,
"patch": 0,
"prerelease": [
"local"
],
"build": "sha.323393a",
"version": "2.0.0-local",
"codeName": "snapshot",
"isSnapshot": true,
"full": "2.0.0-local+sha.323393a",
"branch": "master",
"commitSHA": "323393a86201db871c2fbc6dc7bd12229b498d9a"
},
"sections": [
{ {
"name": "Bootstrapping", "name": "Bootstrapping",
"description": "<p><code>import {bootstrap} from &#39;angular2/platform/browser&#39;;</code>\n</p>\n", "description": "<p><code>import {bootstrap} from &#39;angular2/angular2&#39;;</code>\n\n</p>\n",
"items": [ "items": [
{ {
"syntax": "bootstrap​(MyAppComponent, [MyService, provide(...)]);", "syntax": "bootstrap​(MyAppComponent, [MyService, provide(...)]);",
"bold": [ "bold": [
"provide" "provide"
], ],
"description": "<p>Bootstraps an application with MyAppComponent as the root component, and\nconfigures the app&#39;s dependency injection providers.</p>\n" "description": "<p>Bootstraps an application with MyAppComponent as the root component and configures the DI providers. </p>\n"
} }
], ],
"index": 0 "index": 0
@ -107,7 +125,7 @@
}, },
{ {
"name": "Built-in directives", "name": "Built-in directives",
"description": "<p><code>import {NgIf, ...} from &#39;angular2/common&#39;;</code>\n</p>\n", "description": "<p><code>import {NgIf, ...} from &#39;angular2/common&#39;;</code>\n\n</p>\n",
"items": [ "items": [
{ {
"syntax": "<section *ngIf=\"showSection\">", "syntax": "<section *ngIf=\"showSection\">",
@ -145,7 +163,7 @@
}, },
{ {
"name": "Forms", "name": "Forms",
"description": "<p><code>import {FORM_DIRECTIVES} from &#39;angular2/common&#39;;</code>\n</p>\n", "description": "<p><code>import {FORM_DIRECTIVES} from &#39;angular2/common&#39;;</code>\n\n</p>\n",
"items": [ "items": [
{ {
"syntax": "<input [(ngModel)]=\"userName\">", "syntax": "<input [(ngModel)]=\"userName\">",
@ -159,7 +177,7 @@
}, },
{ {
"name": "Class decorators", "name": "Class decorators",
"description": "<p><code>import {Directive, ...} from &#39;angular2/core&#39;;</code>\n</p>\n", "description": "<p><code>import {Directive, ...} from &#39;angular2/core&#39;;</code>\n\n</p>\n",
"items": [ "items": [
{ {
"syntax": "@Component({...})\nclass MyComponent() {}", "syntax": "@Component({...})\nclass MyComponent() {}",
@ -180,14 +198,14 @@
"bold": [ "bold": [
"@Injectable()" "@Injectable()"
], ],
"description": "<p>Declares that a class has dependencies that should be injected into the constructor when the dependency\ninjector is creating an instance of this class.</p>\n" "description": "<p>Declares that a class has dependencies that should be injected into the constructor when the dependency injector is creating an instance of this class.\n\n</p>\n"
} }
], ],
"index": 4 "index": 4
}, },
{ {
"name": "Directive configuration", "name": "Directive configuration",
"description": "<p><code>@Directive({ property1: value1, ... })</code>\n</p>\n", "description": "<p><code>@Directive({ property1: value1, ... })</code>\n\n</p>\n",
"items": [ "items": [
{ {
"syntax": "selector: '.cool-button:not(a)'", "syntax": "selector: '.cool-button:not(a)'",
@ -208,7 +226,7 @@
}, },
{ {
"name": "Component configuration", "name": "Component configuration",
"description": "<p><code>@Component</code> extends <code>@Directive</code>,\nso the <code>@Directive</code> configuration applies to components as well</p>\n", "description": "<p>\n<code>@Component</code> extends <code>@Directive</code>,\nso the <code>@Directive</code> configuration applies to components as well</p>\n",
"items": [ "items": [
{ {
"syntax": "viewProviders: [MyService, provide(...)]", "syntax": "viewProviders: [MyService, provide(...)]",
@ -252,7 +270,7 @@
}, },
{ {
"name": "Class field decorators for directives and components", "name": "Class field decorators for directives and components",
"description": "<p><code>import {Input, ...} from &#39;angular2/core&#39;;</code>\n</p>\n", "description": "<p><code>import {Input, ...} from &#39;angular2/core&#39;;</code>\n\n</p>\n",
"items": [ "items": [
{ {
"syntax": "@Input() myProperty;", "syntax": "@Input() myProperty;",
@ -315,7 +333,7 @@
}, },
{ {
"name": "Directive and component change detection and lifecycle hooks", "name": "Directive and component change detection and lifecycle hooks",
"description": "<p>(implemented as class methods)</p>\n", "description": "<p>(implemented as class methods)\n</p>\n",
"items": [ "items": [
{ {
"syntax": "constructor(myService: MyService, ...) { ... }", "syntax": "constructor(myService: MyService, ...) { ... }",
@ -385,7 +403,7 @@
}, },
{ {
"name": "Dependency injection configuration", "name": "Dependency injection configuration",
"description": "<p><code>import {provide} from &#39;angular2/core&#39;;</code>\n</p>\n", "description": "<p><code>import {provide} from &#39;angular2/core&#39;;</code>\n\n</p>\n",
"items": [ "items": [
{ {
"syntax": "provide(MyService, {useClass: MyMockService})", "syntax": "provide(MyService, {useClass: MyMockService})",
@ -416,7 +434,7 @@
}, },
{ {
"name": "Routing and navigation", "name": "Routing and navigation",
"description": "<p><code>import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, ...} from &#39;angular2/router&#39;;</code>\n</p>\n", "description": "<p><code>import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, ...} from &#39;angular2/router&#39;;</code>\n\n</p>\n",
"items": [ "items": [
{ {
"syntax": "@RouteConfig([\n { path: '/:myParam', component: MyComponent, as: 'MyCmp' },\n { path: '/staticPath', component: ..., as: ...},\n { path: '/*wildCardParam', component: ..., as: ...}\n])\nclass MyComponent() {}", "syntax": "@RouteConfig([\n { path: '/:myParam', component: MyComponent, as: 'MyCmp' },\n { path: '/staticPath', component: ..., as: ...},\n { path: '/*wildCardParam', component: ..., as: ...}\n])\nclass MyComponent() {}",
@ -484,4 +502,5 @@
], ],
"index": 10 "index": 10
} }
] ]
}

133
public/docs/ts/latest/guide/router.jade
View File

@ -380,18 +380,21 @@ figure.image-display
Here are the details for readers inclined to build the sample through this milestone. Here are the details for readers inclined to build the sample through this milestone.
Our starter app's structure looks like this: Our starter app's structure looks like this:
code-example(format=""). .filetree
router-sample .file router-sample
├── node_modules/ .children
├── app/ .file node_modules
| ├── app.component.ts .children
│ ├── boot.ts .file app
│ ├── crisis-list.component.ts .children
│ └── hero-list.component.ts .file app.component.ts
├── index.html .file boot.ts
├── styles.css .file crisis-list.component.ts
├── tsconfig.json .file hero-list.component.ts
└── package.json .file index.html
.file styles.css
.file tsconfig.json
.file package.json
:marked :marked
Here are the application-specific files Here are the application-specific files
+makeTabs( +makeTabs(
@ -448,11 +451,12 @@ figure.image-display
When were done organizing, we have three "Hero" files: When were done organizing, we have three "Hero" files:
code-example(format=""). .filetree
app/heroes/ .file app/heroes
├── hero-detail.component.ts .children
├── hero-list.component.ts .file hero-detail.component.ts
└── hero.service.ts .file hero-list.component.ts
.file hero.service.ts
:marked :marked
Here as in the tutorial, we'll provide the `HeroService` during bootstrapping Here as in the tutorial, we'll provide the `HeroService` during bootstrapping
so that is available anywhere in the app (see `boot.ts`) . so that is available anywhere in the app (see `boot.ts`) .
@ -581,21 +585,24 @@ code-example(format="." language="bash").
* pass information along in route parameters (`RouteParams`) * pass information along in route parameters (`RouteParams`)
After these changes, the folder structure looks like this: After these changes, the folder structure looks like this:
code-example(format=""). .filetree
router-sample .file router-sample
├── node_modules/ .children
├── app/ .file node_modules
│ ├── heroes/ .file app
│ │ ├── hero-detail.component.ts .children
│ │ ├── hero-list.component.ts .file heroes
│ │ └── hero.service.ts .children
│ ├── app.component.ts .file hero-detail.component.ts
| ├── boot.ts .file hero-list.component.ts
│ └── crisis-list.component.ts .file hero.service.ts
├── index.html .file app.component.ts
├── styles.css .file boot.ts
├── tsconfig.json .file crisis-list.component.ts
└── package.json .file index.html
.file styles.css
.file tsconfig.json
.file package.json
:marked :marked
<a id="heroes-app-code"></a> <a id="heroes-app-code"></a>
### The Heroes App code ### The Heroes App code
@ -895,20 +902,22 @@ code-example(format="").
We can always try the [live example](../resources/live-examples/router/ts/plnkr.html) and download the source code from there. We can always try the [live example](../resources/live-examples/router/ts/plnkr.html) and download the source code from there.
Our final project folder structure looks like this: Our final project folder structure looks like this:
code-example(format=""). .filetree
router-sample .file router-sample
├── node_modules/ .children
├── src/ .file node_modules
├── app/ .file src
│ ├── crisis-center/... .file app
│ ├── heroes/... .children
│ ├── app.component.ts .file crisis-center/...
│ ├── boot.ts .file heroes/...
│ └── dialog.service.ts .file app.component.ts
├── index.html .file boot.ts
├── styles.css .file dialog.service.ts
├── tsconfig.json .file index.html
└── package.json .file styles.css
.file tsconfig.json
.file package.json
:marked :marked
The top level application files are The top level application files are
+makeTabs( +makeTabs(
@ -929,14 +938,16 @@ code-example(format="").
<a id="crisis-center-structure-and-code"></id> <a id="crisis-center-structure-and-code"></id>
### Crisis Center ### Crisis Center
The *Crisis Center* feature area within the `crisis-center` folder follows: The *Crisis Center* feature area within the `crisis-center` folder follows:
code-example(format=""). .filetree
app/ .file app
crisis-center/ .children
├── crisis-center.component.ts .file crisis-center
├── crisis-detail.component.ts .children
├── crisis-list.component.ts .file crisis-center.component.ts
├── crisis.service.ts .file crisis-detail.component.ts
└── routes.ts .file crisis-list.component.ts
.file crisis.service.ts
.file routes.ts
:marked :marked
+makeTabs( +makeTabs(
`router/ts/app/crisis-center/crisis-center.component.ts, `router/ts/app/crisis-center/crisis-center.component.ts,
@ -953,12 +964,14 @@ code-example(format="").
:marked :marked
### Heroes ### Heroes
The *Heroes* feature area within the `heroes` folder is next: The *Heroes* feature area within the `heroes` folder is next:
code-example(format=""). .filetree
app/ .file app
heroes/ .children
├── hero-detail.component.ts .file heroes
├── hero-list.component.ts .children
└── hero.service.ts .file hero-detail.component.ts
.file hero-list.component.ts
.file hero.service.ts
:marked :marked
+makeTabs( +makeTabs(
`router/ts/app/heroes/hero-list.component.ts, `router/ts/app/heroes/hero-list.component.ts,