How can I fixed the Error value is not iterable

Viewed 893

In my table, I iterate the rows through outputting the value. As soon as there is no value, I get the error value is not iterable. How can I work around this error?

My Code:

if (null != data && data) {
  
data = data.map((item) => {
   const value = item.deadlineEntityList;
      delete item.deadlineEntityList;
        const deadlines = [];
            for (const deadlineEntity of value) { // Here is the Error
              deadlines.push({
                deadlineId: deadlineEntity.deadlineId,
                period: deadlineEntity.deadlinePeriod,
                value: deadlineEntity.value
              });
            }
            return {...item, ...{ deadlines }};
          });

          const rows = [];
          const salesAreaNames = _.uniq(data.map((d) => d.kagName)) as string[];
          for (const n of salesAreaNames) {
            const salesAreaData = data.find((d) => d.kagName === n);
            if (salesAreaData && salesAreaData !== null) {
              const row: any = { kagName: salesAreaData.kagName, values: {}, mandantKagId: salesAreaData.mandantKagId };
              for (const deadline of salesAreaData.deadlines) {
                row.values[deadline.period.toLowerCase()] = this.transformAmount(deadline.value);
              }
              rows.push(row);
            }
          }
          this.data = rows;
        }
2 Answers

You can do it:

 for (const deadlineEntity of (value ?? [])) { // Here is the Error

It'll prevent that value will get an error, because if it doesn't have some value, it'll iterate the []

Try something like this...


const data = [];

if (null != data && data) {
  data = data.map((item) => {
    let { deadlineEntityList, ...itemWithoutDeadlineEntityList } = item;

    deadlineEntityList = deadlineEntityList || [];

    const deadlines = deadlineEntityList.map((deadlineEntity) => {
      return {
        deadlineId: deadlineEntity.deadlineId,
        period: deadlineEntity.deadlinePeriod,
        value: deadlineEntity.value,
      };
    });
    return { ...itemWithoutDeadlineEntityList, deadlines };
  });

  const rows = [];
  const salesAreaNames = _.uniq(data.map((d) => d.kagName)) as string[];

  salesAreaNames.forEach((salesAreaName) => {
    const salesAreaData = data.find((d) => d.kagName === salesAreaName);
    const row: any = {
      kagName: salesAreaData.kagName,
      values: {},
      mandantKagId: salesAreaData.mandantKagId,
    };

    salesAreaData.deadlines.forEach((deadline) => {
      row.values[deadline.period.toLowerCase()] = this.transformAmount(
        deadline.value,
      );
    });

    rows.push(row);
  });

  this.data = rows;
}

To help reading the code, I suggest you to always format the code. Give a try with tools like Prettier.

Related