Как структурировать Модель и Сервис в приложении Angular?

Question

У меня есть следующий компонент Angular 6 для редактирования сообщения:

import { Component, OnInit, Input } from '@angular/core';

@Component({
  selector: 'post-edit',
  templateUrl: './post-edit.component.html',
  styleUrls: ['./post-edit.component.less']
})

export class PostEditComponent implements OnInit {

  @Input() id: number;
  title: string;
  content: string;
  categoryId: number;

  categories: Array<{ id: number, name: string }>;

  constructor() { }

  ngOnInit() {
  }

}

При вызове API для получения данных для сообщения с postId он возвращает:

{
  "data": [
    {
      "postId": 1,
      "title": "post title",
      "content": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
      "categoryId": 2,
      "created_at": "2018-10-20 10:14:23"
    }
  ]
}

ИтакЯ создал PostService в Angular следующим образом:

@Injectable()
export class PostService {

  constructor(private http: Http) { }

  public get() { }

  public create(post) { }

  public getById(id: number) { }

}

Вопрос 1

Должен ли я определять модель для компонента (редактировать, перечислять, создавать, ...)следующим образом?

export class PostEditModel {
  id: number;
  title: string;
  content: string;
  categoryId: number;
}

Вопрос 2

Должна ли переменная categories, содержащая список категорий, отображаться в HTML «select», быть включена в PostEditModelили просто в компоненте как есть?

Вопрос 3

Свойства Post в PostEditComponent или PostEditModel меньше свойств, возвращаемых API (пример:create_at).

Должен ли каждый метод обслуживания иметь свою собственную модель?Например:

public getById(id: number) { }

вернет PostServiceGetApiModel, который при вызове PostEditComponent будет сопоставлен с PostEditModel.

Каков наилучший способ сделать это сопоставление?

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

Answer 1

Ответ 1

Одна модель на один компонент.Какими бы ни были ваши файлы для модуля Post , это прекрасно.

Каждый модуль должен иметь следующие файлы: - Компонент - Сервис - Модель - Модуль - Маршрут

Ответ 2

Нет.

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

Ответ 3

Нет.

Я думаю, что мы рассмотрели это в Ответ 1 .

Предложение

Помимо вас вопрос = Лучшесоздать только PostComponent, который включает в себя оба PostEditComponent ИЛИ PostAddComponent.Вы можете справиться с этим легко с Angular.Вы просто должны проверить параметр в маршруте.

Answer 2

Ответ 1

Нет.Достаточно одной модели с необязательными полями.Например, в модели добавления не будет идентификатора, если он был создан онлайн.Таким образом, модель может быть:

export interface Post {
  id?: number;
  title: string;
  content: string;
  categoryId: number;
}

Обратите внимание, что я объявляю interface вместо class как Angular предлагает модели данныхбыть интерфейсами вместо классов.

Подумайте об использовании интерфейса для моделей данных.

Ответ 2

Я думаю, чтоcategoryId уже включено в модель.Поэтому я не уверен, есть ли необходимость включать категории там.

Однако я бы посоветовал вам создать enum для категорий просто ради строгой типизации, где бы вы ни назначали или использовалиenum s.

Ответ 3

Я думаю Ответ 1 также отвечает на этот вопрос.Модель Post может содержать все поля, связанные с публикацией, присутствующей в любой операции CRUD для Post.Поэтому, если некоторые присутствуют на всех этапах CRUD, просто оставьте их обязательными и оставьте их необязательными.Так что created_at может быть необязательным