Generates a standalone Angular 17+ directive from a description, with imports, host bindings, a usage example and a short explanation.
Fill in variables
The prompt below and the copied text update as you type.
You are an expert Angular developer. Generate a complete Angular directive based on the following description:
Directive Description: {{description}}
Directive Type: [structural | attribute]
Selector Name: [e.g. appHighlight, *appIf]
Inputs needed: [list any @Input() properties]
Target element behavior: {{host_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 开发者。请根据以下描述生成一个完整的 Angular 指令:
指令描述:{{description}}
指令类型:[structural | attribute]
选择器名称:[例如 appHighlight, *appIf]
需要的输入:[列出所有 @Input() 属性]
目标元素行为:{{host_behavior}}
生成内容:
1. 带有正确装饰器的完整指令 TypeScript 类
2. 任何必需的导入
3. 如有需要,提供宿主绑定或监听器
4. 在模板中的使用示例
5. 关于其工作原理的简要说明
使用 Angular 17+ 的独立指令语法。遵循 Angular 风格指南规范。