Skip to content
Boost your Angular development
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
README.md

README.md

Angular ngx-kit  Angular-RU npm version

Приветсвую всех участников и гостей сообщества Angular-RU. На данной странице вы найдете информацию об ngx-kit на русском языке.

Если вы активно работаете с Angular, то наверняка сталкивались с тем, что сторонний компонент не поддерживает какой-то функционал, работает неправильно или выглядит не совсем так, как того требует заказчик-дизайнер-бизнес.

Ngx-kit - это не классическая либа компонентов, а набор генераторов. Что дает возможность быстро добавить компоненты в проект, получив полный доступ к кастомизации.

@ngx-kit/core

Ядро - самостоятельный пакет, который содержит сервисы для упрощения кода сгенерированных компонентов.

@ngx-kit/collection

Коллекция — это набор генераторов кода, который существенно ускоряет работу с ядром. За несколько секунд вы можете добавить любой компонент и потом быстро его модифицировать под свои нужды. Ознакомиться со списком существующих модулей можно на сайте.

Особенности

  • Поддержка AOT
  • Поддержка серверного рендеринга
  • Поддержка OnPush стратегии обнаружения изменений
  • Генерация кода с помощью Angular CLI

Минимальные требования

  • Angular ^6.0.0
  • Angular-cli ^6.0.0

Руководство:

На демке показана быстрая установка пакетов, генерация кода дейт-пикера и его кастомизация:

Использование

Установка пакетов

ng add @ngx-kit/core

Генерация кода с помощью Angular CLI

Пример генерации модуля для кнопки:

ng g @ngx-kit/collection:ui-button my-button

В данном примере я использвал итоговое имя my-button, но оно может быть любым на ваше усмотрение. Что позволяет один и тот же шаблон генерировать несколько раз в рамках одного проекта и модифицировать его под разные нужды.

Подключение сгенерированного модуля

@NgModule({
  ...
  imports: [
    ...
    MyButtonModule,

Использование компонента

<button myButton color="primary">Let's do it!</button>

Модификация кода

Только сложная (и стабильная) логика хранится в [Core-пакете] (https://ngx-kit.com/core), поэтому вы можете любым образом изменять сгенерированные шаблоны и стили.

License

MIT

You can’t perform that action at this time.