首页 > 解决方案 > Angular 5,根本没有调用http POST

问题描述

我正在尝试使用 Angular 5 调用 Http Post 并将其发送到我的后端(使用 springboot 和 MySQL)。用 Postman 测试了后端,这似乎可行。当我试图将 Angular 放入游戏中时,它似乎不起作用。没有编译或控制台错误,spring 也没有收到任何内容。对应的 Angular Service 的代码如下:

post 方法位于底部的 registerProvider 方法中:我想指出那里使用的 console.logs 也打印正确的数据,所以这也不是 ..component.html 的问题

import { Injectable } from '@angular/core';

import { OnInit } from '@angular/core';

import { Router } from '@angular/router';

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

import {Observable} from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';

import { IProvider } from './provider';

@Injectable()
export class ProviderService {

constructor(private router: Router,
            private httpClient: HttpClient ){}

private provider: IProvider= {'email':undefined,'password':undefined};

getProvider(): IProvider {
    return this.provider;
}

getProviderEmail(): string{
    return this.provider.email;
}

getProviderPassword(): string{
    return this.provider.password;
}

setProviderEmail(email: string): void {
    this.provider.email= email;
}

setProviderPassword(password: string): void {
    this.provider.password= password;
}

checkProvider(email: string, password: string): boolean{
    if(email=='provider@a.a' && password=='a'){ //validation of provider
      this.provider.email= email;
      this.provider.password= password;
      return true;
    }
    return false;
}

logOut(): void{
    this.setProviderEmail(undefined);
    this.setProviderPassword(undefined);
    this.router.navigate(['/']);
}

isProviderLogged():boolean{
    return !!(this.getProviderEmail() && this.getProviderPassword());
}

registerProvider(email: string, password: string): Observable<any> {
    console.log(email,password);
    this.setProviderEmail(email);
    this.setProviderPassword(password);
    let backendUrl: string = 'http://localhost:8080/signUpProvider';
    console.log(backendUrl);
    console.log(this.provider);
    return this.httpClient.post<any>(backendUrl, this.provider,{observe : 'response'});
   }
}

标签: angularpost

解决方案


您需要从调用 registerProvider 函数的位置订阅observable。

在调用注册提供程序函数的组件文件中,添加订阅。

registerProvider(email, password).subscribe((res) => {

})

推荐阅读