problem description
I have just begun to contact the questions raised by angularJs, which may be very retarded, so please ask the gods for help.
A new project created directly with ng-cli, followed by online tutorials on the hero instance
, learned a little bit about the use of angular, which is now stuck in the http request section.
the environmental background of the problems and what methods you have tried
uses the method of separating service from component. The request method is encapsulated in service, and the return comes out. The
interface called in component is a login interface for other items. It can be used, and there is no error in the address of the interface.
appends the request of the interface in another project at the bottom.
, which is requested by ajax, keeps reporting 404 errors, but does not see the request
related codes
/ / Please paste the code text below (do not replace the code with pictures)
//app.module.ts
import { BrowserModule } from "@angular/platform-browser";
import { NgModule } from "@angular/core";
import { FormsModule } from "@angular/forms";
import { HttpClientModule } from "@angular/common/http";
import { HttpClientInMemoryWebApiModule } from "angular-in-memory-web-api";
...
@NgModule({
declarations: [
...
],
imports: [
...
HttpClientInMemoryWebApiModule.forRoot(
InMemoryDataService, { dataEncapsulation: false},
)
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
//service.ts
import { Injectable } from "@angular/core";
import { HttpClient, HttpHeaders } from "@angular/common/http";
import { Observable, of } from "rxjs";
import { catchError, map, tap } from "rxjs/operators";
const httpOptions = {
headers: new HttpHeaders({"Content-Type": "application/json; charset=UTF-8"})
}
@Injectable({
providedIn: "root"
})
export class BusinessSystemService {
private result;
private testUrl = "http://192.168.1.201:8080/user/login";
//
getBusinessSystem(): Observable<any> {
return this.http.post<any>(this.testUrl,
{"username": "pwy", "password": "123456"},
httpOptions).pipe(
tap(list => console.log("getTestList success!")),
catchError(this.handleError("getTestList Error"))
);
}
private handleError<T> (operation = "operation", result?: T) {
return(error: any): Observable<T> => {
console.error(error);
// this.log(`${operation} failed:${error.message}`);
return of(result as T);
};
}
constructor(
private http: HttpClient,
) { }
}//component.ts
import { Component, OnInit } from "@angular/core";
import { HttpClient, HttpParams, HttpHeaders } from "@angular/common/http";
import { BusinessSystemService } from "../business-system.service";
@Component({
selector: "app-business-system",
templateUrl: "./business-system.component.html",
styleUrls: ["./business-system.component.css"]
})
export class BusinessSystemComponent implements OnInit {
testList: any;
getTestList(): void {
this.service.getBusinessSystem().subscribe(list => this.testList = list);
}
constructor(
private service: BusinessSystemService,
private http: HttpClient
) { }
ngOnInit() {
this.getTestList();
}
}
change interface and method
//component.ts
import { Component, OnInit } from "@angular/core";
import { HttpClient, HttpParams, HttpHeaders } from "@angular/common/http";
// import { BusinessSystemService } from "../business-system.service";
const httpOptions = {
headers: new HttpHeaders({"Content-Type": "application/json; charset=UTF-8"})
}
const param = new HttpParams().append("username", "pwy").append("password", "123456");
@Component({
selector: "app-business-system",
templateUrl: "./business-system.component.html",
styleUrls: ["./business-system.component.css"]
})
export class BusinessSystemComponent implements OnInit {
testList: any;
getTestList(): void {
// this.service.getBusinessSystem().subscribe(list => this.testList = list);
this.http.get("http://192.168.0.66:9002/secondDel/getindexList", httpOptions)
.subscribe((result) => {
console.log("http success");
this.testList = result;
}, response => {
console.log("http error");
console.log(response);
}, () => {
console.log("The POST observable is now completed.");
});
}
constructor(
// private service: BusinessSystemService,
private http: HttpClient
) { }
ngOnInit() {
this.getTestList();
}
}
what result do you expect? What is the error message actually seen?
swagger
