import {FormControl,FormGroup} from '@angular/forms';

Question

FormsModule has imported on app.module.ts but the problem persists.

Can't bind to 'ngModule' since it isn't a known property of 'input'.

 ("item</h1>
      <form (submit)="addItem()" #form="ngForm">

Can anyone help me?

What is exactly the issue? And please share the code. Thanks! — Fullstack Guy, Aug 24 '18 at 19:06
Appear as an error message when I run the project, I already imported the FormsModule in the app.module.ts but the error persists. This is the message: Can't bind to 'ngModule' since it isn't a known property of 'input'. ("item — Wesley Oliveira, Aug 24 '18 at 19:14
Which components are you working on? Where do you want to put your form? — Marc, Aug 24 '18 at 19:28
I'm working on cadastroitens component, my complete project stay here if you want see https://github.com/dizwes/angular6 — Wesley Oliveira, Aug 24 '18 at 19:32

Ayoub k · Accepted Answer · 2018-08-24T19:48:32.423

3

In your app.module.ts add the following import:

import { FormsModule, ReactiveFormsModule  } from "@angular/forms";

and add them to the imports section:

imports: [
    FormsModule,
    ReactiveFormsModule
],

Edit:

There are two possible reasons:

Missing FormsModule, hence Add this to your Module,

import { FormsModule, ReactiveFormsModule } from '@angular/forms';

@NgModule({
    imports: [
        FormsModule      
    ]

Since you don't use the reactive forms you can remove ReactiveFormsModule from the imports.

Check the syntax/spelling of [(ngModel)] in the input tag.

edited Aug 24 '18 at 19:48

answered Aug 24 '18 at 19:06

Ayoub k

7,788
9
34
57

Still did not work :( – Wesley Oliveira Aug 24 '18 at 19:12
please post your code. – Ayoub k Aug 24 '18 at 19:13
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { RouterModule } from '@angular/router'; import { ROUTES } from './routes'; import { AppComponent } from './app.component'; import { FormsModule } from "@angular/forms"; import { ReactiveFormsModule } from "@angular/forms"; @NgModule({ declarations: [ AppComponent, ], imports: [ FormsModule, ReactiveFormsModule, BrowserModule, RouterModule.forRoot(ROUTES),], providers: [], bootstrap: [AppComponent] }) export class AppModule { } – Wesley Oliveira Aug 24 '18 at 19:16
did you add the following imports: [ FormsModule, ReactiveFormsModule ], – Ayoub k Aug 24 '18 at 19:17
Yeah. imports: [ FormsModule, ReactiveFormsModule, BrowserModule, RouterModule.forRoot(ROUTES),], – Wesley Oliveira Aug 24 '18 at 19:19
please post the html code ans also the component ts – Ayoub k Aug 24 '18 at 19:21
That's my form template:

– Wesley Oliveira Aug 24 '18 at 19:21
and this is my component.ts import { Component, OnInit } from '@angular/core'; import { Item } from './cadastro.model'; import { CadastroService } from './cadastro.service'; import { FormsModule } from '@angular/forms'; @Component({ selector: 'app-cadastroitens', templateUrl: './cadastroitens.component.html', styleUrls: ['./cadastroitens.component.scss'] }) export class CadastroitensComponent implements OnInit { constructor( ) { } ngOnInit() { } } – Wesley Oliveira Aug 24 '18 at 19:22
actually since you don't want to use reactive forms it's better to delete ReactiveFormsModule from the imports. FormsModule import should fix your isuue ! – Ayoub k Aug 24 '18 at 19:27
i snot working, my complete project stay here if you want see: https://github.com/dizwes/angular6 – Wesley Oliveira Aug 24 '18 at 19:33
1

change [(ngModule)] to [(ngModel)]. – Ayoub k Aug 24 '18 at 19:45
Ohhh god, forgive bro and thak you so much! – Wesley Oliveira Aug 24 '18 at 19:48
You're so welcome. Glad i helped. – Ayoub k Aug 24 '18 at 19:49

import {FormControl,FormGroup} from '@angular/forms';

1 Answers1