Добавление / удаление элементов из списка на основе другого списка - PullRequest
0 голосов
/ 03 августа 2020

Мне нужна помощь в оптимизации моего кода.

Объяснение:

Я получаю список данных через API, содержащий код типа, цветовой код и идентификатор .

[
  {"id": 3, "ifsType": "5572", "ifsColor": "DC1A"},
  {"id": 4, "ifsType": "6E6A", "ifsColor": "38D1"},
  {"id": 6, "ifsType": "6E6A", "ifsColor": "11BB"},
  {"id": 15, "ifsType": "688F", "ifsColor": "CFA1"},
  {"id": 16, "ifsType": "688F", "ifsColor": "6926"},
  {"id": 18, "ifsType": "5572", "ifsColor": "39E6"},...
]

Я отображаю этот список данных в таблице матов, группируя их по коду типа (ifsType).

groupBy(list: any[], key: string): any[] {
  return list.reduce((acc, item) => (acc[item[key]] = [...(acc[item[key]] || []), item], acc), {});
}

this.dataSource = Object.values(this.groupBy(ELEMENT_DATA, "ifsType"));

[
  [
    {"id": 3, "ifsType": "5572", "ifsColor": "DC1A"},
    {"id": 18, "ifsType": "5572", "ifsColor": "39E6"}
  ],
  [
    {"id": 4, "ifsType": "6E6A", "ifsColor": "38D1"},
    {"id": 6, "ifsType": "6E6A", "ifsColor": "11BB"}
  ],
  [
    {"id": 15, "ifsType": "688F", "ifsColor": "CFA1"},
    {"id": 16, "ifsType": "688F", "ifsColor": "6926"}
  ],...
]

В моем случае для добавления или удаления тип с его цветами, я возвращаю список для добавления или удаления в API

Однако для редактирования список должен быть изменен через форму. Таким образом, эта модификация приводит к добавлению и / или удалению одного или нескольких цветов для типа.

Следовательно, мне нужно определить элементы, которые нужно добавить в список, а также те, которые нужно удалить так что API позаботится об изменении в БД. Поэтому список для возврата в API изменяется следующим образом:

StackBlitz Link

// Simulating an edit
// Remove the 1st color and add a new one
var newColorCode: string[] = [typeColors[1].ifsColor, newColor(4)]

let formControlIfsType: FormControl = new FormControl(typeColors[0].ifsType)
let formControlIfsColor: FormControl = new FormControl(newColorCode)

/* ========================================================
 * CODE TO OPTIMIZE
 * ======================================================== */
var toAdd: any = [];
var toRemove: any = [];

// Element to remove
typeColors.filter(element => element.ifsType == formControlIfsType.value)
  .forEach(element => {
    if (!formControlIfsColor.value.includes(element.ifsColor)) {
      toRemove.push(element.ifsColor);
    }
  }
)

// Element to add
formControlIfsColor.value.forEach(element => {
  if (!typeColors.map(tc => tc.ifsColor).includes(element)) {
    toAdd.push(element);
  }  
})

toRemove.forEach(element => {
  const index = typeColors.findIndex(tc => tc.ifsColor === element);
  typeColors.splice(index, 1);
})

toAdd.forEach(element => {
  typeColors.push(new TypeColor({ifsType: formControlIfsType.value, ifsColor: element}));
})

I go через несколько списков и Мне это не очень нравится, так как это может замедлить обработку. Поэтому я хотел бы знать, существует ли лучшее решение

Спасибо

...