我正在尝试使用Angular2.0.0-alpha.28(带有相应的.d.ts)TypeScript 1.5.0-beta构建一个小应用程序,我收到以下消息：
Can’t bind to ‘controlGroup’ since it isn’t a know property of the
‘div’ element and there are no matching directives with a
corresponding property
的index.html
<!DOCTYPE html> <html> <head lang="en"> <Meta charset="UTF-8"> <title>Angular 2</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/css/bootstrap.min.css" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/css/font-awesome.min.css" /> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:400,600" /> <script src="https://github.jspm.io/jmcriffey/bower-traceur-runtime@0.0.87/traceur-runtime.js"></script> <script src="https://jspm.io/system@0.16.js"></script> <script src="https://code.angularjs.org/2.0.0-alpha.28/angular2.dev.js"> </script> </head> <body> <radar>Loading...</radar> <script>System.import('radar-view');</script> </body> </html>
雷达view.ts
/// <reference path="typings/angular2/angular2.d.ts" />
import {Component,View,bootstrap} from 'angular2/angular2';
import {FormBuilder,Validators,formDirectives,ControlGroup} from 'angular2/angular2';
@Component({
selector: 'radar',appInjector: [FormBuilder]
})
@View({
template: '<div [control-group]="form"><input control="levels"> {{form.controls.levels.value}}</div>',directives: [formDirectives]
})
export class RadarView {
form: ControlGroup;
builder: FormBuilder;
constructor(builder: FormBuilder) {
this.builder = builder;
this.form = builder.group({
levels: ["5"]
});
}
}
bootstrap(RadarView);
编译
tsc --watch --target es5 --module commonjs --emitDecoratorMetadata
此外,当我尝试使用validators.required时,它看起来似乎也找不到：
this.form = builder.group({
levels: ["5",Validators.required]
});
Error:(21,38) TS2339: Property ‘required’ does not exist on type
‘typeof Validators’.
我的代码出了什么问题？
解决方法
感谢schmck Validators.required实际上不是常规angular2.d.ts v.2.0.0-alpha.28的一部分.
对于此问题,解决方案是将以下内容添加到angular2.d.ts：
class Validators {
static required: any;
}
同样来自Pawel Kozlowski(https://github.com/angular/angular/issues/2779),< div [control-group] =“form”>< input control =“levels”>必须被替换< div [ng-control-group] =“form”>< input ng-control =“levels”>.这仍然无法正常工作没有ControlContainer的提供者！ ($__ 0 – > ControlContainer).
