角度6中的json嵌套结构

时间:2018-06-23 20:36:10

标签: arrays json angular typescript

我是新手。我需要将数据发送到后端系统。对象的结构就像这样

interface semester {
  Id: number;
  Semester: string;
  Year: number;
  course: course[];
}

interface course {
  CourseNumber: number;
  CourseTitle: string;
  CurriculumID: string;
}

每次按下添加按钮并尝试如下开发对象并将其发送到后端api时,我的用户界面都会添加一门课程。

添加第一门课程:

[  
   {  
      "Id":"20193",
      "Semester":"Fall",
      "Year":"2018",
      "course":[  
         {  
            "CourseNumber":"100",
            "CourseTitle":"CEU: Contemporary Collective Bargaining",
            "CurriculumID":"00004285"
         }
      ]
   }
]

并且在不同的学期中再增加一门课程时

[  
   {  
      "Id":"20193",
      "Semester":"Fall",
      "Year":"2018",
      "course":[  
         {  
            "CourseNumber":"100",
            "CourseTitle":"CEU: Contemporary Collective Bargaining",
            "CurriculumID":"00004285"
         }
      ]
   },
   {  
      "Id":"20195",
      "Semester":"Spring",
      "Year":"2019",
      "course":[  
         {  
            "CourseNumber":"230",
            "CourseTitle":"American Indians of Minnesota",
            "CurriculumID":"00007541"
         }
      ]
   }
]

第三次在上学期添加课程时,结构应如下所示

[  
   {  
      "Id":"20193",
      "Semester":"Fall",
      "Year":"2018",
      "course":[  
         {  
            "CourseNumber":"100",
            "CourseTitle":"CEU: Contemporary Collective Bargaining",
            "CurriculumID":"00004285"
         },
         {  
            "CourseNumber":"101",
            "CourseTitle":"Design Foundations",
            "CurriculumID":"00000897"
         }
      ]
   },
   {  
      "Id":"20195",
      "Semester":"Spring",
      "Year":"2019",
      "course":[  
         {  
            "CourseNumber":"230",
            "CourseTitle":"American Indians of Minnesota",
            "CurriculumID":"00007541"
         }
      ]
   }
]

单击按钮后从表单捕获的结果

this.selectedSemester={Id: "20193", Semester: "Fall ", Year: "2018"};
this.selectedCourse={CourseNumber:"240",CourseTitle:"Painting",CurriculumID:"00001025"}

并编写了addCourse方法来捕获所需格式的数据

courseList: semester[];
addCourse(){
  this.courseList.push({
  Id: this.selectedSemester.Id,
  Semester: this.selectedSemester.Semester,
  Year: this.selectedSemester.Year,
  course: this.selectedCourse
        }
      );
    }

在学期中,Id是唯一的键ID。任何人都可以用语法帮助形成这个对象。

2 个答案:

答案 0 :(得分:3)

您可以用这种方式组装对象

您有自己的界面

export interface ISemester {
    Id: number;
    Semester: string;
    Year: number;
    course: ICourse[];
}

export interface ICourse {
    CourseNumber: number;
    CourseTitle: string;
    CurriculumID: string;
}

您有实现接口的模型

export class Semester implements ISemester {
    Id: number;
    Semester: string;
    Year: number;
    course: ICourse[];
}

export class Course implements ICourse {
    CourseNumber: number;
    CourseTitle: string;
    CurriculumID: string;
}

您有一个ISemester类型的列表,您可以在其中插入学期对象。这学期的对象会获得课程对象,您可以将其推入课程列表。

const semesters: Array<ISemester> = [];

const semester1 = new Semester();
semester1.Id = 1000;
semester1.Semester = 'Semester1';
semester1.Year = 2018;

const course1 = new Course();
course1.CourseNumber = 1;
course1.CourseTitle = 'Title1';
course1.CurriculumID = '00123';

semester1.course.push(course1);

const course2 = new Course();
course1.CourseNumber = 5;
course1.CourseTitle = 'Title2';
course1.CurriculumID = '00124';

semester1.course.push(course2);

semesters.push(semester1);

const semester2 = new Semester();
semester1.Id = 1001;
semester1.Semester = 'Semester2';
semester1.Year = 2019;

const course3 = new Course();
course1.CourseNumber = 101;
course1.CourseTitle = 'Title4';
course1.CurriculumID = '00800';

semester1.course.push(course3);

semesters.push(semester2);

这将得出包含一个或n个课程的学期列表。

答案 1 :(得分:1)

以下是如何根据更新后的信息处理对象的示例:

mongod &