Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular 2, Typescript Module has no exported constant 'FORM_DIRECTIVES'

I am trying to include one existing component in my app and from sample code I have these dependencies:

import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass} from 'angular2/common';

Now I am using '@angular' instead of 'angular2' which would I think be something like this:

import { Component, OnInit, CORE_DIRECTIVES } from '@angular/core';
import { FORM_DIRECTIVES } from '@angular/forms';

However I get this error

mypath/node_modules/@angular/forms/index"' has no exported member 'FORM_DIRECTIVES'.
mypath/node_modules/@angular/core/index"' has no exported member 'CORE_DIRECTIVES'.

How am I supposed to include FORM_DIRECTIVES and if they are no longer part of angular2 what is the replacement or new way to resolve dependencies?

I have checked angular changelog but couldn't find anything

like image 632
Darko Rodic Avatar asked Dec 25 '22 01:12

Darko Rodic


2 Answers

FORM_DIRECTIVES are now part of FormsModule, so you should import FormsModule and add it to your module's imports.

CORE_DIRECTIVES are now part of CommonModule which is exported by BrowserModule. You already import BrowserModule in your AppModule, so you don't need to do anything about CORE_DIRECTIVES. Here's the example of basic module with imported FormsModule:

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

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

export class AppModule { }
like image 143
Stefan Svrkota Avatar answered Dec 28 '22 11:12

Stefan Svrkota


you should to install :

npm install --save angular2

like that :

 "dependencies": {
    "@ngrx/store": "^1.2.1",
    "angular2": "^2.0.0-beta.7",
    "es6-promise": "^3.0.2",
    "es6-shim": "^0.33.3",
    "reflect-metadata": "0.1.2",
    "rxjs": "5.0.0-beta.2",
    "zone.js": "0.5.15"
  }

This works:

import {ControlGroup, Control, FORM_DIRECTIVES} from "angular2/common";

@Component({
    selector: 'person-form',
    directives: [FORM_DIRECTIVES],
    template: require('./person_form.html')
})

export class PersonForm { ... } 
This fails with FORM_DIRECTIVES as undefined:

import {ControlGroup, Control} from "angular2/common";

@Component({
    selector: 'person-form',
    directives: [FORM_DIRECTIVES],
    template: require('./person_form.html')
})

export class PersonForm { ... } 
like image 25
Anouar Mokhtari Avatar answered Dec 28 '22 10:12

Anouar Mokhtari