SharedModule exports ReactiveFormsModule and I import SharedModule in another module and it doesn't work

Viewed 1419

I have some doubts about how SharedModule works. I need to use FormGroups and FormControl on a module, so I must import SharedModule to that module. SharedModule exports FormsModule, ReactiveFormsModule, so I dont't know why it doesn't recognize yet Formgroup and FormControl names. This is the error that I get: Can't bind to 'formGroup' since it isn't a known property of 'form'.

This is my shared.module.ts :

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RequiredLabelDirective } from './directives/required-label.directive';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';



@NgModule({
    imports: [
        CommonModule,
        ReactiveFormsModule,

    ],
    declarations: [RequiredLabelDirective],
    exports: [
        RequiredLabelDirective,
        FormsModule,
        ReactiveFormsModule
    ]
})
export class SharedModule { }

And this is the module in which I want to export the SharedModule so that:

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SharedModule} from '../../shared/shared.module';

@NgModule({
  imports: [
    CommonModule,
    SharedModule
  ],
  declarations: []
})
export class MisDatosModule { }

This is the code of MisDatos.component.ts:

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

@Component({
  selector: 'app-mis-datos',
  templateUrl: './mis-datos.component.html',
  styleUrls: ['./mis-datos.component.scss']
})
export class MisDatosComponent implements OnInit {


      profileForm = new FormGroup({
          Name:     new FormControl('NombreDelProfesional'),
          Surname:     new FormControl('ApellidoDelProfesional'),
          Dni:     new FormControl('DNIPROFESIONAL'),
          Email:     new FormControl('unEmail@gmail.com'),
          Password:     new FormControl('ayquepasswordmasmalo'),
          Phone:     new FormControl('12354566')
  });



  constructor() { }

  ngOnInit() {
  }

}

And this is the structure of my Angular Project.

Structure

Other question that I have. For example, if MisDatos wouldn't have a module, what will happen? Could I import the SharedModule on ProfesionalModule and this could work???? I mean, can you use a module from another component that has no his one module????

Hope you help me, thanks so much. I am a begginner.

0 Answers
Related