Angular 2 - 创建嵌套的JSON对象

时间:2016-06-15 17:45:53

标签: json typescript angular

我正在开发一个Angular 2项目,该项目要求我创建一个具有地址详细信息的用户,如下所示

{ "address": {
"addition": null,
"city": "Eindhoven",
"housenumber": 12,
"street": "Streetname"},
"email": "a@b.com",
"password": "",
"username": "YourName"}

当我获取用户对象时,上面的例子是结果。要将用户对象POST到后端,我需要创建具有相同结构的JSON。

当我收到它时,我能够显示这个JSON文件的详细信息。我创建了两个类:

import {Address} from "./Address";
/**
 * Created by Adjoa on 6/14/2016.
 */
export class User {
    name:string;
    username:string;
    email:string;
    address:Address;



    constructor(name:string, username:string, email:string, address:Address) {
        this.name = name;
        this.username = username;
        this.email = email;
        this.address = address;
    }

    public static createEmptyUser():User{
        return new User("","","",null);
    }
}

在将用户发送给API之前,我需要帮助创建一个具有地址的用户。

1 个答案:

答案 0 :(得分:0)

如果你定义

jQuery(document).ready(function () {
    $("#grid").jqGrid({
        url: 'GetDemandeurs_Cons',
        datatype: 'json',
        mtype: 'GET',
        colNames: [
                    'Code',
                    'Nom',
                    'Prenoms',
                    'Courriel',
                    'Adresse_Demandeur',
        ],
        colModel: [
                { key: true, name: 'Code_Demandeur', index: 'Code_Demandeur' },
                { key: false, name: 'Nom_Demandeur', index: 'Nom_Demandeur' },
                { key: false, name: 'Prenoms_Demandeur', index: 'Prenoms_Demandeur' },
                { key: false, name: 'Courriel1_Demandeur', index: 'Courriel1_Demandeur' },
                { key: false, name: 'Adresse_Demandeur', index: 'Adresse_Demandeur' },
        ],
        pager: $('#pager'),
        rowNum: 10,
        rowList: [5, 10, 20, 50],
        height: '100%',
        emptyrecords: "Pas d'enregistrement à afficher",
        jsonReader: {
            root: "rows",
            page: "page",
            total: "total",
            records: "records",
            repeatitems: false,
            id: "0"
        },
        autowidth: true,
        multiselect: false,
        sortname: 'Code_Demandeur',
        sortorder: "asc",
        viewrecords: true,
        //caption: '<bListe des demandeurs</b>',
        onSelectRow: function (ids) {
            var data = $("#grid").getRowData(ids);
            if (ids != null) {
                console.log(data.Code_Demandeur);
                console.log(data.Adresse_Demandeur);
                $("#detailsDdeur")
                        .setGridParam({ url: "GetDdeurs_Cons_Subgrid?id=" + data.Code_Demandeur, page: 1 })
                        .setCaption("<b>Details pour : " + data.Prenoms_Demandeur + ' ' + data.Nom_Demandeur + "</b>")
                        .trigger('reloadGrid');
            }
        }
    }).navGrid(pager, { edit: false, add: false, del: false, refresh: true, search: false });
    jQuery("#grid").jqGrid('hideCol', ["Adresse_Demandeur"]);
    $("#detailsDdeur").jqGrid
    ({
        height: 100,
        datatype: "json",
        colNames: [
                    'Adresse_Demandeur',
                    'Ville',
                    'Province',
                    'Code Postal',
                    'Téléphone',
                    'Tel2_Demandeur',
                    'Tel3_Demandeur',
                    'Courriel2_Demandeur',
                    'Courriel3_Demandeur',
                    'ID_SituationMatrimoniale',
                    'Sexe',
                    'Date de Naissance',
                    'Revenu_Demandeur',
                    'ID_Occupation',
                    'ID_Scolarite',
                    'ID_StatutLegal',
                    'ID_Communaute',
                    'ID_SourceInformation',
                    'Handicape',
                    'Reference',
                    'Remarques_Demandeur',
                    'Photo'
        ],
        colModel:
        [
                { key: false, name: 'Adresse_Demandeur', index: 'Adresse_Demandeur' },
                { key: false, name: 'Ville', index: 'Ville' },
                { key: false, name: 'Province', index: 'Province' },
                { key: false, name: 'CodePostal_Demandeur', index: 'CodePostal_Demandeur' },
                { key: false, name: 'Tel1_Demandeur', index: 'Tel1_Demandeur' },
                { key: false, name: 'Tel2_Demandeur', index: 'Tel2_Demandeur' },
                { key: false, name: 'Tel3_Demandeur', index: 'Tel3_Demandeur' },
                { key: false, name: 'Courriel2_Demandeur', index: 'Courriel2_Demandeur' },
                { key: false, name: 'Courriel3_Demandeur', index: 'Courriel3_Demandeur' },
                { key: false, name: 'SitMat', index: 'SitMat' },
                { key: false, name: 'Sexe', index: 'Sexe' },
                { key: false, name: 'Date_Naissance_Demandeur', index: 'Date_Naissance_Demandeur' },
                { key: false, name: 'Revenu_Demandeur', index: 'Revenu_Demandeur' },
                { key: false, name: 'Occupation', index: 'Occupation' },
                { key: false, name: 'Scolarite', index: 'Scolarite' },
                { key: false, name: 'StatutLegal', index: 'StatutLegal' },
                { key: false, name: 'Communaute', index: 'Communaute' },
                { key: false, name: 'SourceInformation', index: 'SourceInformation' },
                { key: false, name: 'Handicape', index: 'Handicape' },
                { key: false, name: 'Reference', index: 'Reference' },
                { key: false, name: 'Remarques_Demandeur', index: 'Remarques_Demandeur' },
                { key: false, name: 'ID_Photo', index: 'ID_Photo' }
        ],
        rowNum: 5,
        rowList: [5, 10, 20],
        jsonReader: {
            root: "rows",
            page: "page",
            total: "total",
            records: "records",
            repeatitems: false,
            id: "0"
        },
        viewrecords: true,
        sortorder: "desc",
    }).navGrid('#OrderPager', { add: false, edit: false, del: false, search: false });

});

usermodel = new User('','','',Address) 之外,然后返回

'createEmptyUser'

在其内部,JSON将呈现其形状。