为什么我的 http.post 在 angular 2 中不工作。只是无法弄清楚我错过了什么。
这里是 login.component.ts 文件
export class LoginComponent implements OnInit{
model: any = {};
loading = false;
constructor(
private router: Router,
private authenticationService: AuthenticationService,
private alertService: AlertService
){}
ngOnInit(){
// reset login status
this.authenticationService.logout();
}
login(){
let errMsg: string;
this.loading = true;
this.authenticationService.login(this.model.username, this.model.password)
.subscribe(
data => {
console.log('Success');
//this.router.navigate(['/']);
},
error => {
console.log('Error');
this.loading = false;
}
);
}
这是authentication.service.ts
@Injectable()
export class AuthenticationService{
private baseUrl = '..';
constructor(private http: Http){}
login(username: string, password: string): Observable<Response>{
let body = JSON.stringify({username: username, password: password});
let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers});
const url = `${this.baseUrl}/api/auth/login`;
return this.http.post(url, body, options)
.map(this.extractData)
.catch(this.handleError);
}
logout(){
// remove user from local storage to log user out
localStorage.removeItem('currentUser');
}
private extractData(res: Response) {
let body = res.json();
return body.data || { };
}
private handleError (error: Response | any) {
// In a real world app, we might use a remote logging infrastructure
let errMsg: string;
if (error instanceof Response) {
const body = error.json() || '';
const err = body.error || JSON.stringify(body);
errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
} else {
errMsg = error.message ? error.message : error.toString();
}
console.error(errMsg);
return Observable.throw(errMsg);
}
这是路由文件
const appRoutes: Routes = [
{ path: '', component: LoginComponent },
{ path: 'home', component: HomeComponent, canActivate: [AuthGuard] },
{ path: 'login', component: LoginComponent },
// otherwise redirect to home
{ path: '**', redirectTo: '' }
];
@NgModule({
imports: [ RouterModule.forRoot(appRoutes) ],
exports: [ RouterModule ]
})
export class AppRoutingMoudle{}
如有任何帮助,我们将不胜感激。谢谢!
最佳答案
import { Injectable } from '@angular/core';
import {Headers, Http, Response,RequestOptions} from '@angular/http';
import 'rxjs/add/operator/toPromise';
import {Observable} from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
@Injectable()
在您的服务之上导入这些,然后在构造函数中执行
constructor(private _http:Http) { }
然后你可以用这个._http.post
关于javascript - http.post 在 Angular 2 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40860135/