Angular 角度-如何定义复杂对象的模型?
我有一个角度的对象结构:Angular 角度-如何定义复杂对象的模型?,angular,Angular,我有一个角度的对象结构: this.calendar = { "years": { 2018: { "months": 0: { "weeks": 1: { "days": {
this.calendar = {
"years": {
2018: {
"months":
0: {
"weeks":
1: {
"days": {
1: {
date: "2018-05-01",
is_valid: true,
price: {'single': 21}
},
2: {
date: "2018-05-02",
is_valid: true,
price: {'single': 31}
},
3: {
date: "2018-05-03",
is_valid: true,
price: {'single': 231}
},
4: {
date: "2018-05-04",
is_valid: true,
price: {'single': 41}
}
}
},
2: {
"days": {
1: {
date: "2018-05-01",
is_valid: true,
price: {'single': 21}
},
...
}
},
},
1: {
"weeks":
...
},
...
},
2019: {
...
}
}
我想将其定义为模型中的接口,因为结构很可能保持不变(或者将来会添加一些新东西)
calendar.model.ts
export interface calendar {
...
}
是否有可能以某种有意义且可理解的方式在模型中定义如此复杂的结构?您的界面可能如下所示:
interface calendar {
years: {
[year: number]: {
months: {
[month: number]: {
weeks: {
[week: number]: {
days: {
[day: number]: {
date: string,
is_valid: boolean,
price: {
[quantity: string]: number
}
}
}
}
}
}
}
}
}
}
我不知道除了单曲
,是否还会有另一个价格
,所以请随意更改
但是请注意,您发布的对象不是有效的JSON。我只是猜到了
"months":
0: {
实际手段
"months": {
0: {
等等,所以这将是一个有效的分配:
const data: calendar = {
"years": {
2018: {
"months": {
0: {
"weeks": {
1: {
"days": {
1: {
date: "2018-05-01",
is_valid: true,
price: { 'single': 21 }
},
2: {
date: "2018-05-02",
is_valid: true,
price: { 'single': 31 }
},
3: {
date: "2018-05-03",
is_valid: true,
price: { 'single': 231 }
},
4: {
date: "2018-05-04",
is_valid: true,
price: { 'single': 41 }
}
}
},
2: {
"days": {
1: {
date: "2018-05-01",
is_valid: true,
price: { 'single': 21 }
}
}
}
}
}
}
}
}
};
我建议将声明分成几个小部分。当您需要以较小的部分构建数据时(即添加一天),这将更加容易
export interface Calendar {
years: Year[];
}
export interface Year {
year: number;
months: Month[];
}
export interface Month {
month: number;
days: Day[];
}
export interface Day {
day: number
date: string;
is_valid: boolean;
price: {
single: number
}
}
然后,可以按如下方式声明对象:
const data: Calendar = {
years: [{
year: 2018,
months: [{
month: 0,
days: [{
day: 1,
date: "2018-01-02",
is_valid: true,
price: { single: 21 }
}]
}]
}]
};
是的,可能比这更复杂。看看Array还有一个很好的应用程序,或者如果你使用的是vscode插件,它可以帮助你,但请根据模型结构创建一个接口。一年一次,一个月一次,等等。我认为唯一值得提取自己界面的部分是
日
部分。太好了,非常感谢!是的,白天的部分有点复杂,所以我同意:)