Управление данными в Angular - ссылки на другие объекты в классах с большим количеством повторяющейся информации

Question

Я действительно не знаю, как это назвать, но мне интересно, есть ли название для этой техники / некоторые ресурсы, обучающие, как это сделать.Я хочу передать данные из API на сервере в Angular, и я хочу, чтобы модульные объекты имели дочерние свойства, которые будут многократно повторяться.Например, имея 100 ответов на опрос, и каждый ответ на опрос указывает на один из 10 вопросов.

Было бы неэффективно, чтобы бэкэнд передавал те же 10 вопросов назад с каждым ответом на опрос, было бы многоповторяется.Было бы более разумно передать 10 вопросов, а затем передать 100 ответов на опрос с числовым указателем на 10 вопросов.Как бы я тогда справился с этим на интерфейсе?Будет ли служба сопоставлять вопросы с ответами?Будет ли Javascript хранить эти объекты как ссылки, а не создавать кучу ненужной памяти?Очень важно: если бы я изменил один из вопросов по одному из объектов ответа, обновит ли он этот вопрос по всем другим объектам ответа?

export class Answer {
    id: number;
    response: number;
    question: Question;
}

export class Question {
    id: number;
    question: string;
}

Дайте мне знать, могу ли я предоставить больше информации.Спасибо!

Answer 1

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

Я бы сделал это так, обращаясь к заданным вами объектам.

Не указывайте идентификатор ответа в объекте ответа, а сам ответ.Остальные могут оставаться как есть.

export class Answer {
    id: number;
    response: string;
    questionId: number;
}

export class Question {
    id: number;
    question: string;
}

Поместить объекты в массивы.

private questions: Array<Question> = [];
private answers: Array<Answer> = [];

Вот простой пример того, как соотносить ответы и вопросы по их идентификаторам.

constructor() { 

    const question: Question = new Question(); 
    question.id = 1000;
    question.question = 'What?';
    this.questions.push(question);

    question.id = 1001;
    question.question = 'Who?';
    this.questions.push(question);

    question.id = 1002;
    question.question = 'Why?';
    this.questions.push(question);

    const answer: Answer = new Answer();
    answer.id = 10000;
    answer.questionId = 1000;
    answer.response = 'That I';
    this.answers.push(answer);

    answer.id = 10001;
    answer.questionId = 1000;
    answer.response = 'That II';
    this.answers.push(answer);

    answer.id = 10002;
    answer.questionId = 1000;
    answer.response = 'That III';
    this.answers.push(answer);

    answer.id = 10003;
    answer.questionId = 1001;
    answer.response = 'Me';
    this.answers.push(answer);

    answer.id = 10004;
    answer.questionId = 1001;
    answer.response = 'You';
    this.answers.push(answer);

    answer.id = 10005;
    answer.questionId = 1001;
    answer.response = 'Him';
    this.answers.push(answer);

}

Как видите, вы можете связать столько вопросов, сколько захотите, на тот или иной вопрос.И это все.

Теперь вам нужен сервис, который обрабатывает отношения.Он должен содержать все методы, которые выполняют такие задачи, как fetchQuestionById(id: number) и т. Д.

Поскольку у вас есть только 100 ответов и 10 вопросов вместо 100 ответов и 1000 вопросов, используемая память не будет проблемойвообще.

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

Answer 2

Если вы измените Answer следующим образом:

  export class Answer {
    id: number;
    response: number;
    questionId: number;
}

Вы решите первую проблему.Затем вы загружаете в пользовательский интерфейс Question в соответствии с id.

Вторая часть вашего вопроса немного абстрактна.Это зависит от того, как вы отображаете данные, будет ли представление обновляться в любом месте при изменении.Если вы структурируете представление непосредственно из ответа API, ответ будет отрицательным.Если вы отобразите ответ в виде формы (например, ReactiveForm), тогда да, но вам понадобятся некоторые дополнительные возможности.

В общем, задать столько вопросов в одном посте будет довольно сложно:)