-import { Control, ControlGroup, Validators } from '@angular/common';
+import { Validators } from '@angular/common';
import { Component, OnInit } from '@angular/core';
+import { FormGroup, FormControl, REACTIVE_FORM_DIRECTIVES } from '@angular/forms';
import { Router } from '@angular/router';
import { UserService } from '../shared';
@Component({
selector: 'my-user-add',
template: require('./user-add.component.html'),
+ directives: [ REACTIVE_FORM_DIRECTIVES ]
})
export class UserAddComponent implements OnInit {
- userAddForm: ControlGroup;
+ userAddForm: FormGroup;
error: string = null;
+ username = '';
+ password = '';
constructor(private router: Router, private userService: UserService) {}
ngOnInit() {
- this.userAddForm = new ControlGroup({
- username: new Control('', Validators.compose([ Validators.required, Validators.minLength(3), Validators.maxLength(20) ])),
- password: new Control('', Validators.compose([ Validators.required, Validators.minLength(6) ])),
+ this.userAddForm = new FormGroup({
+ username: new FormControl('', [ <any>Validators.required, <any>Validators.minLength(3), <any>Validators.maxLength(20) ]),
+ password: new FormControl('', [ <any>Validators.required, <any>Validators.minLength(6) ]),
});
}
- addUser(username: string, password: string) {
+ addUser() {
this.error = null;
- this.userService.addUser(username, password).subscribe(
+ this.userService.addUser(this.username, this.password).subscribe(
ok => this.router.navigate([ '/admin/users/list' ]),
err => this.error = err