",
"bold": [
"[ngClass]"
],
"description": "
把一个元素上CSS类的出现与否，绑定到一个真值映射表上。右侧的表达式应该返回类似{class-name: true/false}的映射表。
\n"
}
],
"index": 2
},
{
"name": "表单",
"description": "
import {FORM_DIRECTIVES} from 'angular2/common';\n\n
\n",
"items": [
{
"syntax": "
",
"bold": [
"[(ngModel)]"
],
"description": "
提供双向绑定，为表单控件提供解析和验证。
\n"
}
],
"index": 3
},
{
"name": "类装饰器",
"description": "
import {Directive, ...} from 'angular2/core';\n\n
\n",
"items": [
{
"syntax": "@Component({...})\nclass MyComponent() {}",
"bold": [
"@Component({...})"
],
"description": "
声明当前类是一个组件，并提供关于该组件的元数据。
\n"
},
{
"syntax": "@Directive({...})\nclass MyDirective() {}",
"bold": [
"@Directive({...})"
],
"description": "
声明当前类是一个指令，并提供关于该指令的元数据。
\n"
},
{
"syntax": "@Pipe({...})\nclass MyPipe() {}",
"bold": [
"@Pipe({...})"
],
"description": "
声明当前类是一个管道，并且提供关于该管道的元数据。
\n"
},
{
"syntax": "@Injectable()\nclass MyService() {}",
"bold": [
"@Injectable()"
],
"description": "
声明当前类有一些依赖，当依赖注入器创建该类的实例时，这些依赖应该被注入到构造函数中。\n\n
\n"
}
],
"index": 4
},
{
"name": "指令配置",
"description": "
@Directive({ property1: value1, ... })\n\n
\n",
"items": [
{
"syntax": "selector: '.cool-button:not(a)'",
"bold": [
"selector:"
],
"description": "
指定一个CSS选择器，以便在模板中找出该指令。支持的选择器包括element,\n[attribute], .class, 和 :not()。
\n
不支持父子关系选择器。
\n"
},
{
"syntax": "providers: [MyService, provide(...)]",
"bold": [
"providers:"
],
"description": "
为当前指令及其子指令提供依赖注入的providers数组。
\n"
}
],
"index": 5
},
{
"name": "组件配置",
"description": "
\n@Component extends @Directive,\nso the @Directive configuration applies to components as well
\n",
"items": [
{
"syntax": "viewProviders: [MyService, provide(...)]",
"bold": [
"viewProviders:"
],
"description": "
依赖注入provider的数组，局限于当前组件的视图中。
\n"
},
{
"syntax": "template: 'Hello {{name}}'\ntemplateUrl: 'my-component.html'",
"bold": [
"template:",
"templateUrl:"
],
"description": "
当前组件视图的内联模板或外部模板地址
\n"
},
{
"syntax": "styles: ['.primary {color: red}']\nstyleUrls: ['my-component.css']",
"bold": [
"styles:",
"styleUrls:"
],
"description": "
内联CSS样式或外部样式表URL的列表，用于给组件的视图添加样式。
\n"
},
{
"syntax": "directives: [MyDirective, MyComponent]",
"bold": [
"directives:"
],
"description": "
组件模板中用到的指令列表。
\n"
},
{
"syntax": "pipes: [MyPipe, OtherPipe]",
"bold": [
"pipes:"
],
"description": "
组件模板中用到的管道列表。
\n"
}
],
"index": 6
},
{
"name": "供指令类或组件类用的字段装饰器。",
"description": "
import {Input, ...} from 'angular2/core';\n\n
\n",
"items": [
{
"syntax": "@Input() myProperty;",
"bold": [
"@Input()"
],
"description": "
声明一个输入属性，以便我们可以通过属性绑定更新它。(比如：\n<my-cmp [my-property]="someExpression">).
\n"
},
{
"syntax": "@Output() myEvent = new EventEmitter();",
"bold": [
"@Output()"
],
"description": "
声明一个输出属性，以便我们可以通过事件绑定进行订阅。(比如：<my-cmp (my-event)="doSomething()">)
\n"
},
{
"syntax": "@HostBinding('[class.valid]') isValid;",
"bold": [
"@HostBinding('[class.valid]')"
],
"description": "
把宿主元素的属性(比如CSS类：valid)绑定到指令/组件的属性(比如：isValid)。
\n"
},
{
"syntax": "@HostListener('click', ['$event']) onClick(e) {...}",
"bold": [
"@HostListener('click', ['$event'])"
],
"description": "
通过指令/组件的方法(例如onClick)订阅宿主元素的事件(例如click)，可选传入一个参数($event)。
\n"
},
{
"syntax": "@ContentChild(myPredicate) myChildComponent;",
"bold": [
"@ContentChild(myPredicate)"
],
"description": "
把组件内容查询(myPredicate)的第一个结果绑定到类的myChildComponent属性。
\n"
},
{
"syntax": "@ContentChildren(myPredicate) myChildComponents;",
"bold": [
"@ContentChildren(myPredicate)"
],
"description": "
把组件内容查询(myPredicate)的全部结果，绑定到类的myChildComponents属性。
\n"
},
{
"syntax": "@ViewChild(myPredicate) myChildComponent;",
"bold": [
"@ViewChild(myPredicate)"
],
"description": "
把组件视图查询(myPredicate)的第一个结果绑定到类的myChildComponent属性。对指令无效。
\n"
},
{
"syntax": "@ViewChildren(myPredicate) myChildComponents;",
"bold": [
"@ViewChildren(myPredicate)"
],
"description": "
把组件视图查询(myPredicate)的全部结果绑定到类的myChildComponents属性。对指令无效。
\n"
}
],
"index": 7
},
{
"name": "指令和组件的变更检测与生命周期钩子",
"description": "
(作为类方法实现)\n
\n",
"items": [
{
"syntax": "constructor(myService: MyService, ...) { ... }",
"bold": [
"constructor(myService: MyService, ...)"
],
"description": "
类的构造函数会在所有其它生命周期钩子之前调用。使用它来注入依赖，但是要避免用它做较重的工作。
\n"
},
{
"syntax": "ngOnChanges(changeRecord) { ... }",
"bold": [
"ngOnChanges(changeRecord)"
],
"description": "
在输入属性每次变化了之后、开始处理内容或子视图之前被调用。
\n"
},
{
"syntax": "ngOnInit() { ... }",
"bold": [
"ngOnInit()"
],
"description": "
在执行构造函数、初始化输入属性、第一次调用完ngOnChanges之后调用。
\n"
},
{
"syntax": "ngDoCheck() { ... }",
"bold": [
"ngDoCheck()"
],
"description": "
每当检查组件或指令的输入属性是否变化时调用。通过它，可以用自定义的检查方式来扩展变更检测逻辑。
\n"
},
{
"syntax": "ngAfterContentInit() { ... }",
"bold": [
"ngAfterContentInit()"
],
"description": "
当组件或指令的内容已经初始化、ngOnInit完成之后调用。
\n"
},
{
"syntax": "ngAfterContentChecked() { ... }",
"bold": [
"ngAfterContentChecked()"
],
"description": "
在每次检查完组件或指令的内容之后调用。
\n"
},
{
"syntax": "ngAfterViewInit() { ... }",
"bold": [
"ngAfterViewInit()"
],
"description": "
当组件的视图已经初始化完毕，每次ngAfterContentInit之后被调用。只适用于组件。
\n"
},
{
"syntax": "ngAfterViewChecked() { ... }",
"bold": [
"ngAfterViewChecked()"
],
"description": "
每次检查完组件的视图之后调用。只适用于组件。
\n"
},
{
"syntax": "ngOnDestroy() { ... }",
"bold": [
"ngOnDestroy()"
],
"description": "
在所属实例被销毁前，只调用一次。
\n"
}
],
"index": 8
},
{
"name": "依赖注入配置",
"description": "
import {provide} from 'angular2/core';\n\n
\n",
"items": [
{
"syntax": "provide(MyService, {useClass: MyMockService})",
"bold": [
"provide",
"useClass"
],
"description": "
把MyService类的供应商设置或改写为MyMockService。
\n"
},
{
"syntax": "provide(MyService, {useFactory: myFactory})",
"bold": [
"provide",
"useFactory"
],
"description": "
把MyService的供应商设置或改写为myFactory工厂函数。
\n"
},
{
"syntax": "provide(MyValue, {useValue: 41})",
"bold": [
"provide",
"useValue"
],
"description": "
把MyValue的供应商设置或改写为值41。
\n"
}
],
"index": 9
},
{
"name": "路由与导航",
"description": "
import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, ...} from 'angular2/router';\n\n
\n",
"items": [
{
"syntax": "@RouteConfig([\n { path: '/:myParam', component: MyComponent, name: 'MyCmp' },\n { path: '/staticPath', component: ..., name: ...},\n { path: '/*wildCardParam', component: ..., name: ...}\n])\nclass MyComponent() {}",
"bold": [
"@RouteConfig"
],
"description": "
为所装饰的组件配置路由。支持静态、参数化、带通配符的路由。
\n"
},
{
"syntax": "
",
"bold": [
"router-outlet"
],
"description": "
标记一个位置，用于加载当前激活路由的组件。
\n"
},
{
"syntax": "
",
"bold": [
"[routerLink]"
],
"description": "基于路由指令创建指向不同视图的链接，由路由名和可选参数组成。路由名匹配一个已配置路由的name属性。添加“/”前缀可以导航到根路由。添加“./”前缀可以导航到子路由。
\n"
},
{
"syntax": "@CanActivate(() => { ... })class MyComponent() {}",
"bold": [
"@CanActivate"
],
"description": "用函数定义的一个组件装饰器，路由器会先调用它来检测是否应该激活该组件。应该返回布尔值或承诺(Promise)。
\n"
},
{
"syntax": "routerOnActivate(nextInstruction, prevInstruction) { ... }",
"bold": [
"routerOnActivate"
],
"description": "导航到一个组件之后，路由器调用该组件的routerOnActivate方法(如已定义)。
\n"
},
{
"syntax": "routerCanReuse(nextInstruction, prevInstruction) { ... }",
"bold": [
"routerCanReuse"
],
"description": "路由器调用组件的routerCanReuse方法(如已定义)来检测是复用本实例还是销毁它并创建一个新的。应该返回布尔值或承诺(Promise)。
\n"
},
{
"syntax": "routerOnReuse(nextInstruction, prevInstruction) { ... }",
"bold": [
"routerOnReuse"
],
"description": "当路由器发现可以复用一个组件实例时，它调用组件的routerOnReuse方法(如已定义)。
\n"
},
{
"syntax": "routerCanDeactivate(nextInstruction, prevInstruction) { ... }",
"bold": [
"routerCanDeactivate"
],
"description": "路由器会调用如果要完成导航就得移除的每个组件的routerCanDeactivate方法(如已定义)。当且仅当所有的该方法都返回true或者承诺(Promise)被解决时，导航才会继续。
\n"
},
{
"syntax": "routerOnDeactivate(nextInstruction, prevInstruction) { ... }",
"bold": [
"routerOnDeactivate"
],
"description": "在每个指令因为路由变更而被移除之前调用。可以返回一个承诺，来阻止移除本指令 —— 直到承诺(Promise)被解决。
\n"
}
],
"index": 10
}
]
}