Validations

1) app.module.ts

import { StudentRegComponent } from './student-reg.component';
import { StudentService } from './student.service';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { BrowserModule } from "@angular/platform-browser";
import { ReactiveFormsModule } from "@angular/forms";
@NgModule({
    imports: [BrowserModule, ReactiveFormsModule],
    declarations: [AppComponent,StudentRegComponent],
    providers: [],
    bootstrap:[AppComponent]
})
export class AppModule { }

2) app.component.ts

import { Component, OnInit } from '@angular/core';

@Component({
    selector: 'app',
    templateUrl: 'app.component.html'
})

export class AppComponent implements OnInit {
    constructor() { }

    ngOnInit() { }
}

3) app.component.html

<h1>Student Reg</h1>
<student-reg></student-reg>

4) student-reg.component.html

<form [formGroup]="studentForm">

    Id <input type="text" name="id" formControlName="id"/> <br/>

    <span *ngIf="studentForm.id.invalid&&tudentForm.id.errors.minlength">
        at least 4 charcters should enter
    </span>

    Name <input type="text" name="name" formControlName="name"/><br/>

    <span *ngIf="studentForm.name.invalid&&tudentForm.name.errors.required">
        name is required.
    </span>
    <br/>

    <button (click)="register();" [disabled]="studentForm.invalid">Register</button>
</form>

5)student.ts

export class Student{
    id:number;
    name:string;
}

6)student-reg.component.ts

import { StudentService } from './student.service';
import { Student } from './student';
import { Component, OnInit } from '@angular/core';

@Component({
    selector: 'student-reg',
    templateUrl: 'student-reg.component.html'
})

export class StudentRegComponent implements OnInit {

    studentForm:FormGroup;

    constructor() { }

    ngOnInit() {
        this.studentForm = new FormGroup({
            id:new FormControl('',[Validators.minLength(4)]),
            name:new FormControl('',[Validators.required])
        });
     }

    register(){
        console.log(this.student);
    }
}