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");
}
