通过用户界面创建具有小时数的对象

Question

我无法创建正确的对象。我有一个存储时间的日历。例如，他想要一个时间表来保存这样一个物体

"timeTable":{
    "0": [{"from":"08:00","to":"12:00"}, {"from":"14:00","to":"18:00"}],
    "1": [{"from":"08:00","to":"16:00"}]
  }

如何，点击保存按钮后，发送这样一个对象到：

 timeTable: Map<number, Array<HourScheduleDefinitionModel>>;

接口：

interface HourScheduleDefinitionModel {
  from: string;
  to: string;
}

https://stackblitz.com/edit/angular-ivy-e92ezv?file=src/app/app.component.ts

Answer 1

const getTimeline = () => {
  result = []
  for(item of data){
    var start = 0, timeline = [];
    for(var i = 0; i < item.items.length; i++){
      if(item.items[i] === 1){
        if(start === 0) {
          start = i;
        }
      }else{
        if(start !== 0){
          timeline.push({"from": start < 10 ? "0" + start + ":00" : start + ":00" , "to": i < 10 ? "0" + i + ":00" : i + ":00"})
          start = 0;
        }
      }
  
      if(start !== 0 && i === item.items.length - 1){
        timeline.push({"from": start < 10 ? "0" + start + ":00" : start + ":00" , "to": "00:00"})
      }
    }
  
    result.push({ 
      day: item.name,
      timeline : timeline
    })
  }
  return result;  
}

示例数据：-

data = [
  {
    name: 'Monday',
    items: [0, 1, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1],
    active: true
  },
  {
    name: 'Tuesday',
    items: [1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0],
    active: true
  }
]

结果:-

console.log(getTimeline(data));

[
  {
  day: 'Monday',
  timeline: [
      { from: '01:00', to: '02:00' },
      { from: '03:00', to: '04:00' },
      { from: '20:00', to: '00:00' }
    ]
  },

  {
    day: 'Tuesday',
    timeline: [ { from: '01:00', to: '04:00' }, { from: '20:00', to: '21:00' } ]
  }
]

Answer 2

我认为您需要数组（按数字索引）而不是对象（按字符串索引）：

TS游乐场链接

interface HourScheduleDefinitionModel {
  from: string;
  to: string;
}

type TimeTable = (HourScheduleDefinitionModel[])[];

const tt: TimeTable = [
  [{"from":"08:00","to":"12:00"}, {"from":"14:00","to":"18:00"}], // 0
  [{"from":"08:00","to":"16:00"}], // 1
];

console.log(tt[0]);
console.log(tt[1]);

Answer 3

下面是一个向对象存储添加新映射的工作示例。请注意，代码中没有使用时间表类型，因为@AluanHaddad的注释与我试图解释的内容相同。

    var hours = {"timeTable":{
        "0": [{"from":"08:00","to":"12:00"}, {"from":"14:00","to":"18:00"}],
        "1": [{"from":"08:00","to":"16:00"}]
      }};

    interface HourScheduleDefinitionModel {
      from: string;
      to: string;
    }

    var newHour: HourScheduleDefinitionModel = {
      from: "09:00",
      to: "10:00"
    }

    var key = 2;
    var value = [newHour];
    hours.timeTable[key.toString()] = value

    console.log(hours)

游乐场