如何将嵌套集合映射到TypeScript中的类实例对象

时间:2018-03-14 12:15:37

标签: json angular typescript

我正在研究Angular应用程序,需要使用集合映射嵌套对象。我已经映射了前半部分数据,但我正在努力映射标题映射代码

下的集合,引用选项[]

我添加了一个问题基类,后面跟着我想要映射json数据的DropdownQuestion类。 json数据的结构在数据模型类

数据模型类

export class QuestionsDataModel
{
  consultationId: string;
  displayId: string;
  displayOrder: string;
  questionId: string;
  questionType: string;
  title: string;
  questionElement: {
    questionElementId: string;
    questionElementTypeId: string;
    questionId: string;
    questionElementType: {
        id:string;
        typeDefination: string;
        validation: string;
    };
    preDefineAnswer:{
        questionElementId:string;
        preDefineAnswerId:string;
        text:string;
        preDefineSubAnswer:{
            preDefineAnswerId: string;
            preDefineSubAnswerId: string;
            subText:string;
        };
     };
   }  ;
 }

映射代码(需要帮助)

 for(var key in questionsList)
 {
   let _dropBox = new DropdownQuestion({
      consultationId: questionsList[key].consultationId,
      questionId: questionsList[key].questionId,
      questionElementId: questionsList[key].questionElementId,          
      questionType: questionsList[key].questionType,
      title:questionsList[key].title,
      key: questionsList[key].questionId,    
      label: questionsList[key].title,

      options: [  // need help here, how to map this collection from json data
        {key: 'solid',  value: 'Solid'},
        {key: 'great',  value: 'Great'},
        {key: 'good',   value: 'Good'},
        {key: 'unproven', value: 'Unproven'}
      ],
      order: 1
    });

下拉班级

import { QuestionBase } from './question-base';

 export class DropdownQuestion extends QuestionBase<string> {
 controlType = 'dropdown';
 options: {key: string, value: string}[] = [];

 constructor(options: {} = {}) {
    super(options);
   this.options = options['options'] || [];
 }
 }

问题基础课

export class QuestionBase<T>{
consultationId: string;
questionId: string;
questionElementId:string;
questionType:string;
title:string;
value: T;
key: string;
label: string;
required: boolean;
order: number;
controlType: string;


constructor(options: {
    consultationId?:string,
    questionId?:string,
    questionElementId?:string,
    questionType?:string,
    title?:string,
    value?: T,
    key?: string,
    label?: string,
    required?: boolean,
    order?: number,
    controlType?: string
  } = {}) {
  this.consultationId = options.consultationId,
  this.questionId = options.questionId,
  this.questionElementId = options.questionElementId,
  this.questionType = options.questionType,
  this.title = options.title,
  this.value = options.value;
  this.key = options.key || '';
  this.label = options.label || '';
  this.required = !!options.required;
  this.order = options.order === undefined ? 1 : options.order;
  this.controlType = options.controlType || '';
  }
}

enter image description here

[![enter image description here][1]][1]
使用map 后出现

错误

enter image description here

1 个答案:

答案 0 :(得分:0)

您可以使用Array.prototype.map功能:

for(var key in questionsList)
{
 let _dropBox = new DropdownQuestion({
   [...],
   options: questionsList[key].preDefineAnswer.map(a => {key: a.preDefineAnswerId, value: a.text},
   [...]
 });