Topic: problem with formGroup
Dear,
I'm trying to use FormGoup is not working, the steps I did:
I created a variable "loginForm: FormGroup;" and I imported FormGroup anyway so it does not work on .ts
when I put the <form [formGroup] = "LoginForm"> in the .html component to run. After, I'm not able to simulate the example below in the "ng-uikit-pro-standard-compile-master" template, just set the stop constructor to run.
When using in new design without using the "", that is, only using the Angular, Bootstrap wheel.
Is there anything I have not done?
<form [formGroup]="validatingForm">
<div class="md-form">
<input mdbInputDirective type="number" id="form4" class="form-control" data-error="wrong number" data-success="right number" formControlName="min">
<label for="form4">min value validator</label>
</div>
</form>
import { FormGroup, Validators, FormBuilder } from '@angular/forms';
import { Component } from '@angular/core';
@Component({
selector: 'validators-component-example',
templateUrl: 'validators-example.html',
})
export class ValidatorsComponent {
validatingForm: FormGroup;
constructor(private fb: FormBuilder) {
this.validatingForm = fb.group({
'min': [null, Validators.min(10)],
});
}
}
Add comment
Dear rdelfiaco,
I have tried to reproduce your problem but without success. For me, your code is working fine.
Could you please confirm, if you're have created ValidatorsComponent in your application?
Also, please check if you have imported FormsModule and ReactiveFormsModule in your app.module.ts file. Those modules are necessary in case of use Angular Validation with FormGroup.
Below you can find my code which is working just fine. Please check it.
.html:
<form [formGroup]="validatingForm"> <div class="md-form"> <input mdbInputDirective type="number" id="form4" class="form-control" data-error="wrong number" data-success="right number" formControlName="min"> <label for="form4">min value validator</label> </div> </form>
.ts:
import { Component } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
@Component({
selector:'app-root',
templateUrl:'./app.component.html',
styleUrls: ['./app.component.scss'],
})
export class AppComponent {
validatingForm:FormGroup;
constructor(privatefb:FormBuilder) {
this.validatingForm=fb.group({
'min': [null, Validators.min(10)],
});
}
}
Also, please paste me here your app.module.ts code.
Best Regards,
Damian Status
Answered
Specification of the issue
- User: Pro
- Premium support: No
- Technology: Angular
- MDB Version: 6.2.2
- Device: MAC-PRO
- Browser: Chrome
- OS: IOS
- Provided sample code: No
- Provided link: Yes
Tags
Related topics