将JSON数据从角度形式发送到API

时间:2017-07-21 08:51:12

标签: http ionic2 angular-formly

我想将数据从角度形式发布到API,我不太了解fomly和ionic2组合。我尝试的代码不是将表单数据发送到API,而是在控制台上打印错误。

我的.ts代码是:

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {Validators, FormGroup} from '@angular/forms';
import {FormlyFieldConfig} from 'ng-formly';
import { Http,Headers,RequestOptions } from '@angular/http';
import 'rxjs/add/operator/map';


@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {

post = [];

constructor(public navCtrl: NavController,private http : Http) {

}

form: FormGroup = new FormGroup({});
  userFields: FormlyFieldConfig = [{
    className: 'row',
    fieldGroup: [{
        className: 'col-xs-6',
        key: 'identity',
        type: 'input',
        templateOptions: {
            type: 'email',
            label: 'Email address',
            placeholder: 'Enter email'
        },
        validators: {
          validation: Validators.compose([Validators.required])
        }
    }, {
        className: 'col-xs-6',
        key: 'password',
        type: 'input',
        templateOptions: {
            type: 'password',
            label: 'Password',
            placeholder: 'Password',
            pattern: ''
        },
        validators: {
          validation: Validators.compose([Validators.required])
        }
    }]
  }];

  user = {

  };

  submit(user) {

      let url = "http://urbanholic.com/drago/index.php/api/users/login";





          let data =  {"identity":" ","password":" "}
              let headers = new Headers({
                  'Content-Type': 'application/x-www-form-urlencoded'
              });
               let options = new RequestOptions({ headers: headers, method: "post" });


              this.http.post(url,data,options)
                  .map(res =>  res.json())
                  .subscribe(
                      data => {
                              this.post= data.CarRental;
                              console.log(this.post);


                              },
                     /** data => {console.log(data);},*/
                      err => console.log("error"),

                  );
    }

  }

html代码是:

 <form  [formGroup]="form" (ngSubmit)="submit(user)">
    <formly-form [model]="user" [fields]="userFields">
      <button type="submit" class="btn btn-default" >Button</button>
    </formly-form>
  </form>

0 个答案:

没有答案