NumericTextBoxComponent kendo ui,如何在反应形式中使用,通过设置属性formControlName(angular2)

时间:2017-01-22 03:55:44

标签: forms angular kendo-ui kendo-ui-angular2 kendonumerictextbox

我正在为angular2尝试kendo ui(Ver.RC0)NumericTextBoxComponent,但在api上没有提及组件属性“formControlName”。

我想做类似的事情来验证FormGroup中的表单控件:

<kendo-numerictextbox [value]="myvalue" 
                      formControlName ="myNumericFieldFormControl"
                      >
</kendo-numerictextbox>

这可能吗?如果是,怎么样?

1 个答案:

答案 0 :(得分:0)

它似乎在文档中有用:

http://www.telerik.com/kendo-angular-ui/components/inputs/numerictextbox/#toc-form-support

   @Component({
       selector: 'my-app',
       template: `
           <h4>Only values between -10 and 20 are valid</h4>
           <form [formGroup]="form">
               <kendo-numerictextbox formControlName="numeric" [min]="-10" [max]="20"></kendo-numerictextbox> <br />
               <p *ngIf="form.controls.numeric.errors">{{form.controls.numeric.errors | json}}</p>
           </form>
       `
   })
   export class AppComponent {
       public form: FormGroup;
       constructor(private formBuilder: FormBuilder) {
           this.form = this.formBuilder.group({
               numeric: [20]
           });
       }
   }

这是一个可运行的plunker演示: http://plnkr.co/edit/FlTfasHq8wvRBzCsWbOK?p=preview