angular-forms 是做什麼的？
在 Angular v21+ 中使用新的 Signal Forms API 建立基於訊號的表單。適用於自動雙向綁定、結構化驗證、欄位狀態管理及動態表單的建立。當實作表單、加入驗證、建立多步驟表單或建置具條件式欄位的表單時觸發此技能。Signal Forms 雖屬實驗性功能，但建議用於新的 Angular 專案。請勿用於無訊號的模板驅動表單或第三方表單庫（如 Formly 或 ngx-formly）。
使用 Angular v21+ 新的 Signal Forms API 建立基於訊號的表單。用於自動雙向綁定、結構化驗證、欄位狀態管理及動態表單建立。
此技能專注於在 Angular v21 及更高版本中，利用新的 Signal Forms API 建立基於訊號的新型表單。它支援自動雙向綁定、基於結構的驗證（Schema-based validation）、欄位狀態管理（Field state management），以及動態表單或多步驟表單的實作。Signal Forms 目前仍屬實驗性功能，但官方推薦用於新的 Angular 專案，以取代傳統的 Template-driven forms（無訊號版本）或第三方表單庫（如 Formly、ngx-formly）。觸發此技能的時機包括實作表單、加入驗證規則、建立多步驟流程，或實作具備條件式顯示欄位的表單。
npx skills add https://github.com/analogjs/angular-skills/tree/main/skills/angular-formsInstalled? Explore more 程式設計與開發 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →
在 Angular v21+ 中使用新的 Signal Forms API 建立基於訊號的表單。適用於自動雙向綁定、結構化驗證、欄位狀態管理及動態表單的建立。當實作表單、加入驗證、建立多步驟表單或建置具條件式欄位的表單時觸發此技能。Signal Forms 雖屬實驗性功能，但建議用於新的 Angular 專案。請勿用於無訊號的模板驅動表單或第三方表單庫（如 Formly 或 ngx-formly）。
This repo contains 9 individual skills — each has its own dedicated page.
Create modern Angular standalone components following v20+ best practices. Use for building UI components with signal-based inputs/outputs, OnPush change detection, host bindings, content projection, and lifecycle hooks. Triggers on component creation, refactoring class-based inputs to signals, adding host bindings, or implementing accessible interactive components.
Implement dependency injection in Angular v20+ using inject(), injection tokens, and provider configuration. Use for service architecture, providing dependencies at different levels, creating injectable tokens, and managing singleton vs scoped services. Triggers on service creation, configuring providers, using injection tokens, or understanding DI hierarchy.
Create custom directives in Angular v20+ for DOM manipulation and behavior extension. Use for attribute directives that modify element behavior/appearance, structural directives for portals/overlays, and host directives for composition. Triggers on creating reusable DOM behaviors, extending element functionality, or composing behaviors across components. Note - use native @if/@for/@switch for control flow, not custom structural directives.
Implement HTTP data fetching in Angular v20+ using resource(), httpResource(), and HttpClient. Use for API calls, data loading with signals, request/response handling, and interceptors. Triggers on data fetching, API integration, loading states, error handling, or converting Observable-based HTTP to signal-based patterns.
Implement routing in Angular v20+ applications with lazy loading, functional guards, resolvers, and route parameters. Use for navigation setup, protected routes, route-based data loading, and nested routing. Triggers on route configuration, adding authentication guards, implementing lazy loading, or reading route parameters with signals.
Implement signal-based reactive state management in Angular v20+. Use for creating reactive state with signal(), derived state with computed(), dependent state with linkedSignal(), and side effects with effect(). Triggers on state management questions, converting from BehaviorSubject/Observable patterns to signals, or implementing reactive data flows.
Implement server-side rendering and hydration in Angular v20+ using @angular/ssr. Use for SSR setup, hydration strategies, prerendering static pages, and handling browser-only APIs. Triggers on SSR configuration, fixing hydration mismatches, prerendering routes, or making code SSR-compatible.
Write unit and integration tests for Angular v20+ applications using Vitest or Jasmine with TestBed and modern testing patterns. Use for testing components with signals, OnPush change detection, services with inject(), and HTTP interactions. Triggers on test creation, testing signal-based components, mocking dependencies, or setting up test infrastructure. Don't use for E2E testing with Cypress or Playwright, or for testing non-Angular JavaScript/TypeScript code.
Use Angular CLI and development tools effectively in Angular v20+ projects. Use for project setup, code generation, building, testing, and configuration. Triggers on creating new projects, generating components/services/modules, configuring builds, running tests, or optimizing production builds. Don't use for Nx workspace commands, custom Webpack configurations, or non-Angular CLI build systems like Vite standalone or esbuild direct usage.
Send and manage iMessages via BlueBubbles, including attachments, tapbacks, edits, replies, and groups.
Control Eight Sleep pods (status, temperature, alarms, schedules).
BluOS CLI (blu) for discovery, playback, grouping, and volume.
Create, search, and manage Bear notes via grizzly CLI.
Capture frames or clips from RTSP/ONVIF cameras.
Search GIF providers with CLI/TUI, download results, and extract stills/sheets.