Javascript http.post在angular 2中不起作用

为什么我的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);
}

任何帮助都将不胜感激。谢谢大家!

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) { }

然后你可以把它和这个一起使用

在您的服务上导入这些，然后在构造函数上执行

 constructor(private _http:Http) { }

---

然后您就可以使用它了。_http.post

控制台中有错误吗？

AuthenticationService

上有

Injectable

decorator吗？没有，有一些错误，但我的应用程序会快速登录回登录页面。还有更多。我在URL上找到了这个：。那么，既然是post请求，为什么要在URL中显示参数呢？告诉我在调用API时，您希望在URL中看到什么。我希望得到一个结果，无论是成功还是错误响应。但我不想在发出POST请求时看到URL中的参数。你在chrome开发工具中检查过你的网络选项卡吗？这样我们就可以了解您是否真的进行了post调用。控制台中有错误吗？

AuthenticationService

上有

Injectable

decorator吗？没有，有一些错误，但我的应用程序会快速登录回登录页面。还有更多。我在URL上找到了这个：。那么，既然是post请求，为什么要在URL中显示参数呢？告诉我在调用API时，您希望在URL中看到什么。我希望得到一个结果，无论是成功还是错误响应。但我不想在发出POST请求时看到URL中的参数。你在chrome开发工具中检查过你的网络选项卡吗？这样我们就可以知道你是否真的打了电话。。