Angular 2 Form 序列化成JSON格式
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/39698247/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular 2 Form Serialization Into JSON Format
提问by Tristan C
I am having a little bit of trouble creating my Angular 2 form and converting the submitted data into JSON format for the use of submitting it to my API. I am looking for something that works very similarly to this example:
$.fn.serializeObject = function()
http://jsfiddle.net/sxGtM/3/
The only problem with this example is that the code is written in JQuery, whereas I'm trying to use strictly angular 2.
Any help would be greatly appreciated, I am still very new to angular.
我在创建 Angular 2 表单并将提交的数据转换为 JSON 格式以便将其提交给我的 API 时遇到了一些麻烦。我正在寻找与这个例子非常相似的东西：$.fn.serializeObject = function()
http: //jsfiddle.net/sxGtM/3/这个例子
的唯一问题是代码是用 JQuery 编写的，而我试图使用严格的角度 2 . 任何帮助将不胜感激，我对角度还是很陌生。
回答by Federico Pettinella
You can use the getRawValue()function if you're using a FormGroup, to return an object that can then be serialized using JSON.stringify().
getRawValue()如果您使用的是FormGroup,则可以使用该函数返回一个对象，然后可以使用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)
);
}
}
回答by Mahesh Nepal
You can use JSON.stringify(form.value):
您可以使用JSON.stringify(form.value)：
submit() {
let resource = JSON.stringify(this.form.value);
console.log('Add Button clicked: ' + resource);
this.service.create(resource)
.subscribe(response => console.log(response));
}
Result in Chrome DevTools:
Chrome DevTools 中的结果：
回答by Alexander Ciesielski
You are looking for JSON.stringify(object)which will give you the JSON represantation of your javascript object.
您正在寻找JSON.stringify(object)哪个将为您提供 javascript 对象的 JSON 表示。
You can then POST this using the built-in HTTP service to your server.
然后，您可以使用内置的 HTTP 服务将其 POST 到您的服务器。
