http在角度2中,无法向数据库添加记录

时间:2016-06-22 04:21:03

标签: html typescript angular components

我正在尝试使用Angular2将表单数据发布到我的数据库,但只将空值插入到我的数据库中。我是角色新手可以有人在我的代码中找到错误

我的模板,

 <form (ngSubmit)="onSubmit()" [(ngFormModel)]="form" #f="ngForm">

       <div class="form-row">
         <div class="formHeading">Facebook</div>
        <input type="text" id="fb" ngControl="facebook">
        <div class="errorMessage" *ngIf="f.form.controls.fb.touched &&          !f.form.controls.fb.valid"> Facebook address is required</div>
    </div>


     <div class="form-row">
        <div class="formHeading">Google</div>
        <input type="text" id="gl" ngControl="google"  >
        <div class="errorMessage" *ngIf="f.form.controls.gl.touched && !f.form.controls.gl.valid">Google address is required</div>
    </div>


     <div class="form-row">
        <div class="formHeading">Twitter</div>
        <input type="text" id="twt" ngModel = f.twitter >

    </div>


     <div class="form-row">
        <div class="formHeading">LinkedIn</div>
        <input type="text" id="li" >

    </div>



    <div class="form-row">
        <button type="submit" [disabled]="!f.form.valid">Save</button>
    </div>

</form>

我的组件

      import {Component} from '@angular/core';
      import {FormBuilder, Validators, ControlGroup, FORM_DIRECTIVES} from      '@angular/common';
      import {Http, Response, Headers} from '@angular/http';
      import {Observable} from 'rxjs/Observable';
      import {Subject } from 'rxjs/Subject';

     @Component({
       selector: 'social-form',
       directives:[FORM_DIRECTIVES],
       templateUrl: './components/social/social.html',
       providers: [FormBuilder]
      })

     export class Social {
           http: Http;
           form;
           payLoad = null;

           constructor(fb: FormBuilder) {

          this.form = fb.group({
             "fb": ['', Validators.required],
             "gl": ['',Validators.required],


         });
     }
      constructor(http: Http) {

         this.http = http;
     }
    onSubmit() {


        var headers = new Headers();
        headers.append('Content-Type', 'application/json');

        this.http.post('http://localhost/a2server/index.php/profile/addsocial', JSON.stringify({?????????????}),{headers:headers})
            .map((res: Response) => res.json())
             .subscribe((res:Person) => this.form = res);


        }
   }
     class Person{
    facebook:string;
    google:string;
    twitter:string;
    linkedin:string;
   }

我需要在json stringify中保留什么? 这里我想要验证,所以我把一个类似的构造函数我需要http,我需要另一个构造函数吗?如果是的话我应该把它放在哪里,因为我不能把两个构造函数放在一个组件中。

0 个答案:

没有答案