[](https://dev.azure.com/ajayojha/rxweb/_build/latest?definitionId=39&branchName=master) [](https://git




!image
js
import { Component, OnInit } from "@angular/core";
import {
FormBuilder,
Validators,
FormGroup,
FormControl,
FormArray
} from "@angular/forms";
import { User } from "./models/user";
import { Address } from "./models/address";
import { Skill } from "./models/skill";
import { IFormBuilder, IFormGroup, IFormArray } from "@rxweb/types";
@Component({
selector: "my-app",
templateUrl: "./app.component.html",
styleUrls: ["./app.component.css"]
})
export class AppComponent {
formGroup: IFormGroup;
formBuilder: IFormBuilder;
constructor(formBuilder: FormBuilder) {
this.formBuilder = formBuilder;
}
ngOnInit() {
this.formGroup = this.formBuilder.group({
firstName: ["", [Validators.required]],
address: this.formBuilder.group({
countryName: ["", Validators.required]
}),
skills: this.formBuilder.array([
this.formBuilder.group({
name: ["", Validators.required]
})
])
});
}
}
`
#### Through FormGroup Class
`js
let formGroup: IFormGroup = new FormGroup(>{
firstName: new FormControl((>"")),
}) as IFormGroup;
`
#### Through FormArray Class
`js
let formArray: IFormGroup = new FormArray([
new FormGroup(>{
name: new FormControl((>"")),
}) as IFormGroup
])
`
#### Through FormControl Class
`js
let formControl: FormControl = new FormControl(>"");
``