Angular - Какой самый удобный способ поддерживать и структурировать интерфейсы? - PullRequest
Новая
       17

Angular - Какой самый удобный способ поддерживать и структурировать интерфейсы?

0 голосов
/ 07 марта 2019

Я разрабатываю приложение с Ionic / Angular. Для обработки ответов HTTP я создал интерфейс для управления ответом JSON. Я добавил этот интерфейс с именем interface IOne внизу моего файла. Как: 

export Class Example { 

  private getExample() {
    this.http.get(url, {}, {}).then((result) => { const data: IOne = result.data; });
    return data;
  }

}  

export interface IOne {
  name: string;
}

В будущем будет создано несколько интерфейсов, так как я сделаю несколько HTTP-запросов с разными типами ответов. Таким образом, под моими Class Example и будет очень длинный список интерфейсов, это не аккуратно (я полагаю?) Это будет выглядеть так: 

export Class Example { }  

export interface IOne {
  name: string;
}

export interface ITwo {
  age: number;
}

export interface IThree {
  color: string;
}

Я думал о создании 1 файла с именем interfaces.ts и импорте этого файла в example.ts . Это хорошее решение? Есть ли лучшие альтернативы? Итак, конкретно:

Каков наилучший способ управления и структурирования нескольких интерфейсов, чтобы я мог поддерживать хорошую структуру проекта?

1 Ответ

1 голос
/ 07 марта 2019

Если вы используете Angular CLI, вы можете создать библиотеку, в которую вы поместите все общие ресурсы для одного или нескольких проектов в одну и ту же структуру.

Просто запустите эту команду в корне вашего проекта: 

ng generate library shared

Теперь вы увидите новую папку с именем projects, в которой у вас также есть папка shared.

В этой папке shared вы можете поместить все, что хотите, а затем выставить их через файл public_api.ts, вы увидите, как это делается, на нескольких примерах.

Чтобы посмотреть, как работает shared библиотека: 

ng build shared --watch

Импортировать содержимое в основное приложение так же просто, как сделать: 

import {MyInterface} from 'shared';

Обязательно запустите ng serve после того, как вы выполнили команду построения для shared, или она не будет существовать в папке dist, что приведет к тому, что ваше главное приложение отобразит ошибка, сказав, что не может найти shared.

...