Angular HTTP请求错误：“POST valid request”

Question

我是新来的。我正在创建注册功能，但当我发布请求时，它给我的错误是：“发布有效请求”。请你检查一下我的代码，告诉我我做错了什么。

服务

     import { Injectable, OnInit } from '@angular/core';
        import {HttpModule, Http,Response,Headers, RequestOptions,Request,RequestMethod} from '@angular/http';
        import 'rxjs/add/operator/map';
        import { Observable } from "rxjs/Rx";
        import { User } from './user';
        import { HttpClient,HttpHeaders, HttpRequest } from '@angular/common/http';


        @Injectable({
          providedIn: 'root'
        })
        export class RegisterService implements OnInit {

          posts_Url: string = 'http://localhost:8080/GradeMyDrawings/teacher/register';

            constructor(private http: HttpClient) {

            }

            ngOnInit () {

            }

          registerUser(user:User) {     
             return this.http.post(this.posts_Url, JSON.stringify(user))
              .map((response: Response) => response);           
          }
        }

注册组件

    import {Component, OnInit,Input} from '@angular/core'
        import { CommonService }  from '../../_common/services/common.service';
        import { CommonComponent }  from '../../_common/common.component';
        import { User } from '../../shared/user';
        import { RegisterService } from '../../shared/register.service';
        import { Router, RouterModule } from '@angular/router';
        import {HttpModule, Http,Response,Headers, RequestOptions} from '@angular/http';
        import {HttpClient, HttpErrorResponse} from '@angular/common/http';



        @Component ({
            selector: 'app-login',
            templateUrl: './signup.component.html',
            styleUrls: ['./signup.component.css'],
            providers:[RegisterService]
        })

        export class SignUpComponent  implements OnInit {
         public model:any = [];
            constructor (private _resterservie:RegisterService, private router:Router) {  }    


            ngOnInit () {

            }

            register()
            {
              this._resterservie.registerUser(this.model)
                .subscribe(
                  data => {
                    console.log("Successful");
                  },
                  error=> {
                    console.log("Error");
                  }
                )   
            }


        }

注册HTML

              <div class="form-group">
                  <input type="text" name="tTitle" [(ngModel)]="model.tTitle" #tTitle = "ngModel"  placeholder="Teacher Title" class="form-control" id="tTitle" />
              </div>
              <div class="form-group">
                  <label id="tq1"><strong>Q1:</strong>What is your Birth Date</label>
                  <input type="text" name="tans1" [(ngModel)]="model.tans1" #tans1 = "ngModel"  placeholder="Security Q1" class="form-control" id="tans1" />
              </div>
              <div class="form-group">
                  <label id="tq2"><strong>Q2:</strong> What is your favourite Sports:</label>
                  <input type="text" name="tans2" [(ngModel)]="model.tans2" #tans2 = "ngModel"  placeholder="Security Q2" class="form-control" id="tans2" />
              </div>
              <div class="form-group">
                  <label id="tq3"><strong>Q3:</strong> What is your favourite Color:</label>
                  <input type="text" name="tans3" [(ngModel)]="model.tans3" #tans3 = "ngModel"  placeholder="Security Q3" class="form-control" id="tans3" />
              </div>
              <div class="form-group">
                  <select class="form-control" id="tSignUpType" name="tsignUpType" [(ngModel)]="model.tsignUpType" #tsignUpType = "ngModel">
                      <option>ADMIN</option>
                      <option>TEACHER</option>

                  </select>
              </div>
              <div class="form-group">
                  <input type="text" name="Email" [(ngModel)]="model.Email" #Email = "ngModel"  placeholder="Email" class="form-control" id="tSignUpEmail" />
              </div>

              <div class="form-group" style="position:relative">
                  <div id="pas-mismatch" style="color: red; position: absolute; top: -18px;"></div>
                  <input type="password"  name="password" [(ngModel)]="model.password" #password = "ngModel"  placeholder="Password" class="form-control" id="tSignUpPassword" />
              </div>
              <div class="form-group">
                  <input type="password" name="password2" [(ngModel)]="model.password2" #password2 = "ngModel"  placeholder="Retype password" class="form-control" id="tconfirmpassword" />
              </div>
              <div class="form-group">
                  <input type="submit" name="signup_submit" class="btn btn-primary"  value="Sign up" id="SignUpbtn" />
                  <button class="btn btn-primary signIn">Sign In</button>
              </div>
              <div class="alert alert-success successful_alert" style="display:none;">
                  Successfully Created your Account, You can login Now!
              </div>

          </form>

用户界面

     export interface User {
                        'tsignUpUserid':string;
                        'tsignUpDisplayName':string;
                        'tschoolid':string;
                        'tschoolName':string;
                        'tschoolAd1':string;
                        'tschoolAd2':string;
                        'tschoolZip':string;
                        'tschoolCity':string;
                        'tschoolState':string;
                        'tTitle':string;
                        'tq1':string;
                        'tq2':string;
                        'tq3':string;
                        'tans1':string;
                        'tans2':string;
                        'tans3':string;
                        'tsignUpType':string;
                        'tsignUpPassword':string;
                        'tSignUpEmail':string;

            }

Answer 1

您是否试图将json发送到服务器，是否添加了头内容类型？我认为是来自服务器的错误服务器不接受请求，但如果不接受，请与我们分享一个捕获或关于请求的东西，或控制台错误。

Answer 2

看来你不见了。烟斗。按照下面的方式更新代码。

registerUser(user: User): Observable<any> {
    return this.http.post(this.posts_Url, user)
        .pipe(
        map((response: Response) => response)
    );
}

还要注意:
1。请检查是否真的需要对用户对象进行字符串化。如果api接受json对象，则可以直接传递json对象。2.您不需要在服务类中实现'OnInit'。