无法在Angular2中的api服务器中保存数据

时间:2017-04-18 07:22:26

标签: angular angular2-routing angular2-template angular2-forms angular2-services

尝试使用angular 2和services将数据插入到web api服务器中。无法插入任何数据。可以检测到问题..请问任何一个帮助吗? 感谢

我的HTML

          <h1>Angular2 POST DEMOh1>

                 <hr>
                  <ul>
                 <p>id <input type="text" name="ID" [(ngModel)]="ID">
             <p>Parameter 1 <input type="text" name="param1" 
      [(ngModel)]="param1">
    <p>Parameter 2 <input type="text" name="param2" [(ngModel)]="param2">
           <p>formula 1 <input type="text" name="param3" 
             [(ngModel)]="param3">
              <p>formula 2 <input type="text" name="param4" 
           [(ngModel)]="param4">
             <p>startdate <input type="text" name="param5" 
            [(ngModel)]="param5">
            <p>enddate <input type="text" name="param6" 
             [(ngModel)]="param6">


             <button 
    (click)="SendToApi(ID,param1,param2,param3,param4,param5,param6)">
          Save
           </button></p>
            </ul>

我的服务:尝试使用angular 2和services

将数据插入到web api服务器中
  import {Injectable} from "@angular/core";
  import { Http, Response, Headers, RequestOptions} from "@angular/http";
  import {Observable} from "rxjs/Rx";
  @Injectable()

   export class DemoService {
  constructor(private _httpurl:Http){

       }
            AddDetails(params) {
             let headers = new Headers({ 'Content-Type': 'application/json' 
        });
        let options = new RequestOptions({ headers: headers });
            let body = JSON.stringify(params);
          return this._httpurl.post
  ('http://uraxapiservicepoc2test.azurewebsites.net/api/Test ', body, 
headers)
.map((res: Response) => res.json());
 }

}

我的component.ts:尝试使用angular 2和services

将数据插入到web api服务器中
   import { Component, OnInit } from '@angular/core';
   import {Observable} from "rxjs/Rx";
      import {DemoService} from './DemoService.service'; 
          import { Http, Response, Headers, RequestOptions} from 
         "@angular/http"; 



       @Component({
          selector: 'my-app',
             templateUrl:'../app/app.component.html',
          providers:   [DemoService]        
              })

   export class AppComponent  {


     public ID;
        public param1;
          public param2;
             public param3;
           public param4;
           public param5;
               public param6;


        constructor( private demoservice:DemoService){}

    SendToApi(ID,param1,param2,param3,param4,param5,param6) {
      console.log(ID,param1,param2,param3,param4,param5,param6);
      let data = {ID:ID,param1:param1,
       param2:param2,param3:
        param3,param4:param4,param5:param5,param6:param6};
          this.demoservice.AddDetails(data).subscribe(

          error => {
              console.error("Error saving params!");
              return Observable.throw(error);
               }
               );
             }
                }

1 个答案:

答案 0 :(得分:0)

// this code is in your service 
this._httpurl.post("http://uraxapiservicepoc2test.azurewebsites.net/ ", 
 body, options)
       .map((response:Response) => response.json());
 // this code used to get data 
this.dataService.doSignUp(body).subscribe(result => {

});

你可以试试上面的代码

我希望它会对你有所帮助。