在angular2中使用http.post时出错

Question

我收到400（错误请求）错误。 单击abc.component.html的按钮将调用search($event,'btn')方法，该方法随后在服务中调用某些方法来获取数据。

在这里， getFilteredData()方法提供数据，而searchData()方法不提供数据，但提供400错误。 这是显示错误的图像

abc.component.html

<input [(ngModel)]="searchData" class="form-control"  type="text" placeholder="Search Keywords : 'Lenovo', 'May', 'New York'" style="height: 30px;" />
<input  type="checkbox" id="chckbox" [(ngModel)]="checked" class="form-control"  style="width: 34px;height: 32px;margin:0px;" #chkbox checked>

<button (click)="search($event,'btn')" class="btn btn-success" style="height:30px;padding: 0px 30px">Search </button>

JSON-data.service.ts

searchData(searchText:JsonData): Observable<JsonData[]> {
            console.log('Retriving Data from Solr Server.......');
            let headers = new Headers({ 'Content-Type': 'application/json' });
            let options = new RequestOptions({ headers: headers });
            let url = "http://192.10/PIdString";
            return this.http.post(url,searchText,options).map((res: Response) => res.json()).catch(this.handleError);
          }

getFilteredData(searchText:JsonData): Observable<JsonData[]> {
                console.log('Retriving Data from Solr Server.......' + JSON.stringify(searchText));
                let headers = new Headers({ 'Content-Type': 'application/json' });
                let options = new RequestOptions({ headers: headers });
                let url = "http://1921.le"; //Local Server
                return this.http.post(url, searchText,options).map((res: Response) => res.json()).catch(this.handleError);
              }

abc.component.ts

checked:boolean = true;
          constructor(public jsonDataService: JsonDataService, public injector: Injector) { }

      search(event, from) {
            if(this.checked){
              alert("checked");
            }
            else{
              alert("unchecked");
            }
            if (this.searchData === "" || this.searchData === null) {
           alert("Enter any keyword to search !");
            }else if(this.checked === true && this.searchData === "" || this.searchData === null ){
              alert("Enter any keyword to search !");
            }else if(this.checked !== true && this.searchData === "" || this.searchData === null){
        alert("Enter any keyword to search !");
            }else if(this.checked === true && (this.searchData !== "" || this.searchData !== null)){
        console.log("checked");
        console.log("Searching.......");
           this.jsonDataService.getFilteredData(this.searchData).subscribe(
                  success => this.buildDataUI1(success),
                  error => this.errorMessage = <any>error);  
            }
            else if(this.checked === false && (this.searchData !== "" || this.searchData !== null)){
              console.log("unchecked");
              console.log("Searching.......");
                 this.jsonDataService.searchData(this.searchData).subscribe(
                    success => this.buildDataUI1(success),
                    error => this.errorMessage = <any>error);      
            } 
        }

Answer 1

我看不到您的JSONData是什么样的，所以我只是在猜测。

• 您的模型searchData似乎是基于<input>占位符的字符串。
• 您的组件将searchData原样传递给服务功能。
• 您的服务函数直接将searchData传递为POST负载。

您的端点可能期望使用JSON字符串，而不是纯字符串。