Theres a bunch of people who already asked this question but I already followed every answer by importing it in my app.module.ts file and even imported it in app.spec.ts file
heres the html file:
<p>{{ randomWord }}</p>
<input type="text" [(ngModel)]="enteredValue">
<button (click)="onSubmit()" >Submit</button>
<p>{{ answer }}</p>
heres the app.module.ts file:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import { TestComponent } from './test/test.component';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import { TestComponent } from './test/test.component';
@NgModule({
declarations: [
AppComponent,
TestComponent,
FormsModule
],
imports: [
BrowserModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
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.
The ngModel directive is a directive that is used to bind the values of the HTML controls (input, select, and textarea) or any custom form controls, and stores the required user value in a variable and we can use that variable whenever we require that value. It also is used during form validations.
Use the ngModel selector to activate it. It accepts a domain model as an optional Input . If you have a one-way binding to ngModel with [] syntax, changing the domain model's value in the component class sets the value in the view.
Import FormModule in imports instead of declarations
declarations: [
AppComponent,
TestComponent,
],
imports: [
BrowserModule,
FormsModule
],
Sample Demo
https://stackblitz.com/edit/angular-ngmodel-stackovf?file=app/app.component.html
Adding below code in app.module.ts
file solved my issue
Add forms import
import {FormsModule } from '@angular/forms';
then add FormsModule
in @NgModule
's import section
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
HttpClientModule,
AppRoutingModule,
FormsModule
],
providers: [],
bootstrap: [ AppComponent ]
})
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