I have several submodules in my project, one of them, is the SharedModule (which shares the modules in common for all).
The SharedModule includes the FormsModule and ReactiveFormsModule import. I import this module into the module that I want to use the forms, but it doesn't work.
Component template chunk
<div class="md-form">
<input [formControl]="personGroup.get('medication')" [ngModelOptions]="{standalone: true}" mdbActive type="text" id="medication" class="form-control" #medication>
<label for="medication" class="">Ingrese el medicamento</label>
<button class="btn btn-success btn-sm" (click)="addMedication(medication.value)">
<i class="fa fa-plus" aria-hidden="true"></i>
</button>
SubModule
@NgModule({
declarations: [
...
],
imports: [
...
SharedModule,
...
],
exports: [
...
]
})
export class PeopleModule { }
The SharedModule
import { NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MDBBootstrapModule } from 'angular-bootstrap-md';
import { FormsModule, ReactiveFormsModule } from "@angular/forms";
@NgModule({
imports: [
CommonModule,
...
FormsModule,
ReactiveFormsModule,
...
],
exports: [
...
FormsModule,
ReactiveFormsModule,
...
],
declarations: [
...
],
schemas: [ NO_ERRORS_SCHEMA ],
})
export class SharedModule { }
Answers related to “can't bind to 'ngmodeloptions' since it isn't a known property of 'input'” If ngModel is used within a form tag, either the name attribute must be set or the form control must be defined as 'standalone' in ngModelOptions.
What does "Can't bind to 'x' since it isn't a known property of 'y'" mean? link. This error often means that you haven't declared the directive "x" or haven't imported the NgModule to which "x" belongs. Perhaps you declared "x" in an application sub-module but forgot to export it.
To fix Can't bind to 'ngModel' since it isn't a known property of 'input' error in Angular applications we have to import FormModule in app. module. ts file. If you are using FormBuilder class to create reactive form we have to import ReactiveFormsModule as well to avoid below error.
What Does This Error Mean? Angular is trying to tell us that it doesn't know about the formGroup directive on the <form> element in your component. This usually happens when the wrong forms module is imported, the right module is imported in the wrong place or the ReactiveFormsModule is just not imported at all.
In order to use ngModelOptions
, the ngModel
directive should be applied to the input element:
<input ngModel [ngModelOptions]="{standalone: true}" ... />
because ngModelOptions
is a property of the ngModel
directive.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With