Angular/TypeScript如何批量映射currentTerm数组返回处理后对象集合

解决方案 #

你只需要调整两处代码即可实现需求：

1. 遍历currentTerm数组调用映射方法 #

你原来的mapRent是为单个对象设计的处理逻辑，想要处理整个数组，直接用数组的map方法遍历每个元素调用即可，修改setRentSchedule里的调用逻辑：

// 把原来的这行
// let rentObject = this.mapRent(currentTerm);
// 替换为
let rentObject = currentTerm.map(item => this.mapRent(item));

这样返回的rentObject就是和currentTerm长度一致的对象数组，符合你预期的返回格式。

2. 优化mapRent的空日期兼容逻辑 #

你给出的期望结果里，第一条Current Term的monthsInPeriod和rentInPeriod为null，是因为这条数据的startDate是空字符串，转成日期对象是无效值，直接计算会得到NaN，所以补充下日期合法性判断：

mapRent(scheduleData: any):any{
    let startDate = typeof scheduleData.startDate === 'string' ? new Date(scheduleData.startDate):scheduleData.startDate;
    const endDate = typeof scheduleData.endDate === 'string' ? new Date(scheduleData.endDate):scheduleData.endDate;
    // 新增日期合法性判断
    const isDateValid = !isNaN(startDate.valueOf()) && !isNaN(endDate.valueOf());
    return { 
        description: scheduleData.description,
        monthlyRent: scheduleData.annualRent / 12,
        monthsInPeriod: isDateValid ? (this.Days360(startDate, endDate) / 360) * 12 : null,
        rentInPeriod: isDateValid ? (scheduleData.annualRent / 12) * (this.Days360(startDate, endDate) / 360) * 12 : null,
    }
}

调整后就能完全匹配你给出的期望返回结果。

内容的提问来源于stack exchange，提问作者Ananya Amar