# angular

Правило задаёт соглашения для Angular-кода: от структуры файлов до состояния компонентов. Cursor сможет применять их при работе с файлами TypeScript и HTML.

- правило · `type=rule` · Cursor · ★ 3580
- Автор: sanjeed5
- Лицензия: CC0-1.0 · policy=mirror · начало файла — в конце страницы
- Исходник: https://github.com/sanjeed5/awesome-cursor-rules-mdc/tree/HEAD/rules-mdc/angular.mdc
- Обновлён: 2026-05-19
- HTML: https://affpapa.org/nevibecode/rules/angular

## Что делает

Правило относится к файлам `*.ts` и `*.html`. Оно рекомендует выносить по одному понятию в файл, использовать kebab-case для имён файлов и PascalCase для классов. Новые компоненты, директивы и пайпы предлагается создавать standalone, а зависимости получать через `inject`.

Для локального состояния правило предлагает Angular Signals, а RxJS оставляет для асинхронных потоков и побочных эффектов. Среди примеров управления подписками — `toSignal` и `takeUntilDestroyed`; для шаблонов рекомендован встроенный синтаксис `@if`, `@for` и `@switch` вместо структурных директив. Это соглашения, а не автоматическая миграция: существующий код само правило не переписывает.

В Cursor добавьте файл `.cursor/rules/angular.mdc`. Поскольку область действия охватывает TypeScript и HTML, правило может затрагивать и старые шаблоны: новые компоненты оно предлагает делать standalone, но допускает NgModules для интеграции с легаси-кодом или библиотеками.

## Установка

### Cursor (родная платформа)

**Вручную: положить файлы**
- Файл: `.cursor/rules/angular.mdc` — Во frontmatter: description, globs, alwaysApply

### Claude Code

**Вручную: положить файлы**
- Файл: `.claude/rules/angular.md` — Поле paths во frontmatter ограничивает файлы: globs из источника → paths

### Codex

**AGENTS.md**
- Codex читает AGENTS.md: вставьте текст правила туда

### GitHub Copilot

**Вручную: положить файлы**
- Файл: `.github/instructions/angular.instructions.md` — Поле applyTo задаёт, к каким файлам применять: globs из источника → applyTo

### Windsurf (Devin Desktop)

**Вручную: положить файлы**
- Файл: `.devin/rules/angular.md`

### Cline

**Вручную: положить файлы**
- Файл: `.clinerules/angular.md`

Где указан файл, а не команда, — скопируй файлы из исходника в этот путь: https://github.com/sanjeed5/awesome-cursor-rules-mdc/tree/HEAD/rules-mdc/angular.mdc

## Когда брать
- разделить типы Angular по отдельным файлам
- привести имена файлов и классов к соглашениям
- создать standalone-компоненты без NgModules
- управлять локальным состоянием через Signals
- завершать RxJS-подписки при уничтожении компонента

## Примеры запросов агенту
- Проверь файлы Angular и предложи разделить смешанные типы по отдельным файлам.
- Замени локальное состояние компонента на Signals, а асинхронные потоки оставь на RxJS.
- Обнови шаблон: используй `@if` и `@for` вместо структурных директив.

## Похожие
- [angular-new-app](https://affpapa.org/nevibecode/skills/angular-new-app.md) — скилл · 19300 установок
- [angular-migration](https://affpapa.org/nevibecode/skills/angular-migration.md) — скилл · 10900 установок
- [angular-architect](https://affpapa.org/nevibecode/skills/angular-architect.md) — скилл · 4800 установок
- [angular-best-practices](https://affpapa.org/nevibecode/skills/angular-best-practices.md) — скилл · 756 установок
- [angular-development](https://affpapa.org/nevibecode/skills/angular-development.md) — скилл · 705 установок
- [angular-architecture](https://affpapa.org/nevibecode/skills/angular-architecture.md) — скилл · 320 установок

Из того же набора: [sanjeed5/awesome-cursor-rules-mdc](https://affpapa.org/nevibecode/by/sanjeed5/awesome-cursor-rules-mdc.md) — 240 карточек

_Часть страницы не вошла по размеру — она есть в HTML-версии._

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md