Angular Directive Generator

Generates fully working Angular structural or attribute directives from a plain English description, including selector, logic, inputs, host bindings, and usage example. 来源：https://prompts.chat/prompts/cmmg2f4840007ky046diw5elk

@import-d4edd113c5a5e1337e273b7c

about 2 hours agoNovember 11, 2026 at 02:00 AM

Web Development

Content

Variables

description

what_should_happen_to_the_host_element

You are an expert Angular developer. Generate a complete Angular directive based on the following description: Directive Description: Directive Type: [structural | attribute] Selector Name: [e.g. appHighlight, *appIf] Inputs needed: [list any @Input() properties] Target element behavior: Generate: 1. The full directive TypeScript class with proper decorators 2. Any required imports 3. Host bindings or listeners if needed 4. A usage example in a template 5. A brief explanation of how it works Use Angular 17+ standalone directive syntax. Follow Angular style guide conventions.

Angular Directive Generator

Content

Angular Directive Generator

Content

Comments (0)

Related Skills

Website Design Recreator Skill

Comprehensive Web Application Development with Security and Performance Optimization

Website Creation Command

Web Application Testing Skill (Imported)