@angular/forms/FormsModule missing

Question

I am trying to import the FormsModule from @angular/[email protected] inside Angular 2 RC5. Should be simple right?

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

However this is not part of the @angular/forms library which I installed using

npm install @angular/forms

Some have suggested using:

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

However this doesn't work either.

I've looked into the forms package and it appears that it's in the form_providers typing file (form_providers.d.ts) and it does mention FormsModule. In the forms.js it mentiones __export(require('./form_providers')); so this means it should be available right?

Any ideas how I fix this problem?

Many thanks

JT

app.module.ts

import {NgModule} from '@angular/core';
import {FormsModule}   from '@angular/forms';
import {BrowserModule} from '@angular/platform-browser';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {MeteorModule} from 'angular2-meteor';
import {AppComponent} from './app.component';


@NgModule({
    imports: [BrowserModule, MeteorModule, FormsModule],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
export class AppModule { }

platformBrowserDynamic().bootstrapModule(AppModule,[ disableDeprecatedForms(),provideForms()]));

Package.json (that is being used by "npm install")

{
  "name": "angular2-meteor-base",
  "private": true,
  "scripts": {
    "start": "meteor run",
    "test": "meteor test --driver-package practicalmeteor:mocha",
    "test:ci": "meteor test --once --driver-package dispatch:mocha-phantomjs"
  },
  "devDependencies": {
    "chai": "3.5.0",
    "chai-spies": "0.7.1"
  },
  "dependencies": {
    "@angular/common": "^2.0.0-rc.5",
    "@angular/compiler": "^2.0.0-rc.5",
    "@angular/core": "^2.0.0-rc.5",
    "@angular/forms": "latest",
    "@angular/platform-browser": "^2.0.0-rc.5",
    "@angular/platform-browser-dynamic": "^2.0.0-rc.5",
    "@angular/router": "^3.0.0-rc.1",
    "angular2-meteor": "latest",
    "angular2-meteor-auto-bootstrap": "latest",
    "angular2-meteor-polyfills": "latest",
    "angular2-meteor-tests-polyfills": "latest",
    "es6-shim": "0.35.1",
    "lodash": "^4.15.0",
    "meteor-node-stubs": "0.2.3",
    "reflect-metadata": "0.1.3",
    "rxjs": "5.0.0-beta.6",
    "zone.js": "0.6.12"
  }
}

app.component.ts

import {Component} from '@angular/core';


@Component({
  selector: 'app',
  template: 'Hello World'
})

export class AppComponent {

  constructor() {
  }
}

are you adding FormsModule as as an import in you module component? i.e import { FormsModule } from '@angular/forms'; and... below in the @ngModule like so imports: [BrowserModule, Routing, FormsModule, HttpModule], — Bean0341
– Bean0341, Commented Aug 26, 2016 at 14:22
Have you removed and re-installed the forms package? Otherwise, can you dig into the forms directory (node_modules/@angular/forms/src) and look at the form_providers typing file (form_providers.d.ts) and make sure it mentions FormsModule...if it does, then the package has everything you need, something else wonky is happening — Dave V
– Dave V, Commented Aug 26, 2016 at 14:22
if I am not being clear enough then please post you module.ts component — Bean0341
– Bean0341, Commented Aug 26, 2016 at 14:22

Zetki · Accepted Answer · 2016-08-26 15:24:16Z

1

I had a similar issue and had to update my package.json to specify the version of forms to the following:

"@angular/forms": "^0.3.0",

After that running an npm update.

answered Aug 26, 2016 at 15:24

Zetki

1,9752 gold badges12 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Muhammed Moussa · Accepted Answer · 2020-07-17 12:27:23Z

1

make sure you added FormsModule to the app module or module you are working on and restart the server.

answered Jul 17, 2020 at 12:27

Muhammed Moussa

5,2471 gold badge39 silver badges29 bronze badges

Comments

Grafercode · Accepted Answer · 2020-07-23 20:59:10Z

1

I solved it just using the following steps:

write import {} from '@angular/forms';
after that, write FormsModule in the {}
finally write FormsModule in the imports

It worked.

answered Jul 23, 2020 at 20:59

Grafercode

112 bronze badges

1 Comment

Mawg Over a year ago

A pity that you didn't post a code sample :-(

Collectives™ on Stack Overflow

@angular/forms/FormsModule missing

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related