将Angular 2 Form序列化为JSON格式

我在创建Angular 2表单并将提交的数据转换为JSON格式以便将其提交给我的API时遇到了一些麻烦。我正在寻找一些与此示例非常类似的东西： $.fn.serializeObject = function() http://jsfiddle.net/sxGtM/3/
此示例唯一的问题是代码是用JQuery编写的，而我试图严格使用角度2. 任何帮助都将不胜感激，我对角度还是很陌生的。将Angular 2 Form序列化为JSON格式

来源

2016-09-26 Tristan C

如果您使用的角度，那么为什么有一个在您输入没有ngmodel？ –

因为这是我找到的例子，而不是我的代码。我想用angular 2来实现类似于这个例子的东西 –

您正在寻找JSON.stringify(object)它会给你的JavaScript对象的JSON represantation。

然后，您可以使用内置HTTP服务将此内容发布到您的服务器。

来源

2016-09-26 08:57:27

如果您使用的是FormGroup，则可以使用getRawValue()函数返回一个可以使用JSON.stringify()序列化的对象。

import { Component, OnInit } from '@angular/core'; 
import { FormGroup, FormBuilder } from '@angular/forms' 
import { Http } from '@angular/http'; 

@Component({ 
    selector: 'my-component', 
    templateUrl: 'my-component.component.html' 
}) 
export class MyComponent implements OnInit { 

    form: FormGroup; 

    constructor(private fbuilder: FormBuilder, 
       private http: Http) { } 

    ngOnInit(){ 
     this.form = this.fbuilder.group({ 
      name: '', 
      description: '' 
     }); 
    } 

    sendToAPI(){ 
     let formObj = this.form.getRawValue(); // {name: '', description: ''} 

     let serializedForm = JSON.stringify(formObj); 

     this.http.post("www.domain.com/api", serializedForm) 
      .subscribe(
       data => console.log("success!", data), 
       error => console.error("couldn't post because", error) 
      ); 
    } 
}

来源

2016-09-26 09:36:24

您可以使用JSON.stringify（form.value）。请参阅附件中的图片。