angular - Får oavbrutet fel: Kan inte lösa alla parametrar för


Jag är ny inom Angular 4, jag får ett fel vid kompilering som

Okänt fel: Kan inte lösa alla parametrar för AllCountryComponent: ([object Object], [object Object], ?). vid syntaxError (webpack-internal:///./node_modules/@angular/compiler/esm5/compiler.js:707) vid CompileMetadataResolver._getDependenciesMetadata (webpack-internal:///./node_modules/@angular/compiler/esm5/compiler.js:15927) vid CompileMetadataResolver._getTypeMetadata (webpack-internal:///./node_modules/@angular/compiler/esm5/compiler.js:15762)

Jag har även bifogat en skärmdump av felet:

min allCountry.component.ts-kod är nedan

import { Component, OnInit } from '@angular/core';
import { AppService } from '../../app.service';
import { ActivatedRoute, Route } from '@angular/router';
import {Location} from '@angular/common'

@Component({
  selector: 'app-all-country',
  templateUrl: './all-country.component.html',
  styleUrls: ['./all-country.component.css'],
  providers: [Location,AppService]
})
export class AllCountryComponent implements OnInit {
   public name:string;
   public value:string;
   public listCountry:any[];
  constructor(private http:AppService,private _route:ActivatedRoute ,_rout:Route ) {
              console.log("allcountry constuctor are called");
   }

  ngOnInit() {
    this.name=this._route.snapshot.paramMap.get('name');
    this.value=this._route.snapshot.paramMap.get('value');
   console.log(this.name);
   console.log(this.value);
   this.http.getAllCountry(this.name,this.value).subscribe(
     data=>{
       this.listCountry=data;
       console.log(this.listCountry)
     },
    error=>{
      console.log("error occured")
      console.log(error.errorMessege)
    }
   )


  }

}

app.service.ts

import { Injectable } from '@angular/core';
import { HttpClient  } from '@angular/common/http';

import { Observable } from 'rxjs/Observable';

import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/do';
import 'rxjs/add/operator/toPromise';
import { ApiFormat } from './api-format';

@Injectable()
export class AppService implements ApiFormat {
  public allRegion=[];
  public name:string;
   public value:string;


    public baseUrl="https://restcountries.eu/rest/v2";
  constructor(private http:HttpClient) {
    console.log("service are called");
   }

  public getAllCountry(name:string,value:string):Observable<any>{
       let myResponse = this.http.get(`${this.baseUrl}/${name}/${value}?fields=name;region;capital;currencies;subregion;timezones;population;languages;flag`);
              return myResponse;   
   }

}

app.modul.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule }          from '@angular/forms';
import { RouterModule, Routes } from '@angular/router';
import { HttpClientModule } from '@angular/common/http';

import { AppComponent } from './app.component';
import { AppService } from './app.service';
import { SharedModule } from './shared/shared.module';
import { CountryModule } from './country/country.module';
import { HomeComponent } from './home/home.component';
import { AllCountryComponent } from './country/all-country/all-country.component';


@NgModule({
  declarations: [
    AppComponent,
    HomeComponent,
    AllCountryComponent

  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpClientModule,
    SharedModule,
    CountryModule,
    RouterModule.forRoot([
      {path:"home",component:HomeComponent},
      {path:" ",redirectTo:"home",pathMatch:"full"},
      {path:'*',component:HomeComponent},
      {path:'**',component:HomeComponent},
      {path:"allcountry/:name/:value",component:AllCountryComponent}

    ])
  ],
  providers: [AppService],
  bootstrap: [AppComponent]
})
export class AppModule { }

country.module.ts är

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AllCountryComponent } from './all-country/all-country.component';
import { SigleCountryComponent } from './sigle-country/sigle-country.component';
import { FormsModule } from '@angular/forms';
import { SharedModule } from '../shared/shared.module';
import { RouterModule } from '@angular/router';

@NgModule({
  imports: [
    CommonModule,
    SharedModule,
    FormsModule,
    RouterModule.forChild([
      {path:"allcountry/:name/:value",component:AllCountryComponent},
      {path:"country/:code",component:SigleCountryComponent}
    ])

  ],
  declarations: [AllCountryComponent, SigleCountryComponent]
})
export class CountryModule { }

Svar #1

Felet i bilden säger

Kan inte lösa alla parametrar för AllCountryComponent: ([Object object], [Object object], ?)

Observera ?, det motsvarar det tredje argumentet i din komponentkonstruktor

constructor(private http:AppService,private _route:ActivatedRoute ,_rout:Route ) {
    console.log("allcountry constuctor are called");
}

Det är inte klart varför du har den tredje parametern _rout, dessutom är det inte en klassmedlem (eftersom den inte har någon åtkomstspecifikator) och du har inte använt den någonstans.

Route kan inte tillhandahållas av Angular via DI. Ta bort den tredje parametern så borde det troligen fungera bra.

constructor(private http:AppService,private _route:ActivatedRoute) {
    console.log("allcountry constuctor are called");
}

Relaterade artiklar