Как обновить значения объекта внутри объекта в angular

Question

data = [{
    id: 'stud1',
    row: 1,
    currLine: {
        row: 1,
        line: 1
    },
    newLine: {
        row: 1,
        line: 1
    }
},{
    id: 'stud2',
    row: 2,
    currLine: {
        row: 2,
        line: 2
    },
    newLine: {
        row: 2,
        line: 2
    }
},{
    id: 'stud3',
    row: 3,
    currLine: {
        row: 3,
        line: 3
    },
    newLine: {
        row: 3,
        line: 3
    }
}]


newData = {
    row: 3,
    line: 3,
    data: { id: 'e1', name: 'edward' },
    section: { id: 's1', name: 'emerald' }
}

Я пытаюсь обновить новую строку в строке 3.

результат должен быть таким.

[{
    id: 'stud1',
    row: 1,
    currLine: {
        row: 1,
        line: 1
    },
    newLine: {
        row: 1,
        line: 1
    }
},{
    id: 'stud2',
    row: 2,
    currLine: {
        row: 2,
        line: 2
    },
    newLine: {
        row: 2,
        line: 2
    }
},{
    id: 'stud3',
    row: 3,
    currLine: {
        row: 3,
        line: 3
    },
    newLine: {
         row: 3,
         line: 3,
         data: { id: 'e1', name: 'edward' },
         section: { id: 's1', name: 'emerald' }
    }
}]

Я пытался использовать фильтр, но это всегда ошибка:

data.filter((x: any) => x['row'] === newData['row']);
data['newLine'] = DATA;

, но это ошибки.

Answer 1

Если ваш массив data имеет постоянное количество элементов, вы должны иметь возможность:

data[2].data = newData.data;
data[2].section = newData.section;

Если массив имеет переменное количество элементов, вы можете сделать:

for (let i = 0; i < data.length; i++) {
  if (data[i].row === newData.row) {
    data[i].data = newData.data;
    data[i].section = newData.section;
  }
}

Судя по написанному вами коду, кажется, что вы думали, что функция filter обновит переменную data на месте с элементом, который соответствует фильтру. Так работает filter - он возвращает новый массив всех элементов, соответствующих вашему условию (в данном случае x['row'] === newData['row']).

Итак, когда вы запускаете data['newLine'] = DATA;, вы что-то назначаете в свойство с именем newLine в массиве data. Этот массив данных не изменился, потому что filter не изменил его.

Вероятно, ваш код ошибки, потому что переменная DATA нигде не объявлена.

Answer 2

Вы можете достичь ожидаемого результата, используя map. Вот рабочий пример:

var data = [{ id: 'stud1', row: 1, currLine: { row: 1, line: 1 }, newLine: { row: 1, line: 1 }},{ id: 'stud2', row: 2, currLine: { row: 2, line: 2 }, newLine: { row: 2, line: 2 }},{ id: 'stud3', row: 3, currLine: { row: 3, line: 3 }, newLine: { row: 3, line: 3 }}];

var newData = { row: 3, line: 3, data: { id: 'e1', name: 'edward' }, section: { id: 's1', name: 'emerald' }};

const result = data.map(k=>k.row===newData.row ? (k.newLine=newData, k) : k);

console.log(result);

Внутри карты я помещаю тернарный оператор для сопоставления значения, если сопоставлено, мы назначаем свойство newLine newData, иначе текущий объект возвращается как есть.