未捕获的错误：无法解析AppComponent中的所有参数：（？）

Question

I am doing simple user registration using Angular, Nodejs and MongoDB.

I am unable to post form data from angular to Nodejs to proceed further.

app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import { HttpModule } from '@angular/http';
import { Http, Response, RequestOptions, Headers } from '@angular/http';


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

export class AppModule { }

app.component.html:

<form #registerForm="ngForm" (ngSubmit)="onSubmit(registerForm)">

<div class="form-group">
    <label for="name">Name</label>
    <input type="text" class="form-control" name="name" ngModel>
</div>

<div class="form-group">
    <label for="email">Email</label>
    <input type="email" class="form-control" name="email" ngModel>
</div>

<div class="form-group">
     <label for="password">Password</label>
     <input type="password" class="form-control" name="password" ngModel>
</div>

<div class="form-group">
      <button type="submit">Submit</button>
</div>

</form>

app.component.ts:

import { Component } from '@angular/core';
import { FormBuilder, FormGroup, Validators, FormControl, FormArray } from 
   '@angular/forms';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {
    constructor(private http:Http) { } 
    onSubmit(registerForm) {
        console.log(registerForm.value);
        let url = 'http://localhost:8080/signup';
        this.http.post(url, {registerForm(registerForm)}).subscribe(res => 
           console.log(res.json()));
    }
}

Node (routes.js):

app.post('/signup', passport.authenticate('local-signup', {
    successRedirect : '/login', 
    failureRedirect : '/signup',
    failureFlash : true 
}));

Node server is running on 8080 port.

When I am trying to post data I am getting the following error in the browser console:

Uncaught Error: Can't resolve all parameters for AppComponent: (?).

Can anyone please help to fix this issue? Also it will be great to know how to proceed after.

Answer 1

You forgot to import http to your app.component . You have declared private http:Http in your constructor. So add import { Http } from '@angular/http'; to your app.component .

And use HttpClient instead of legacy Http as commented below.