用途:在 Angular 中搭建设计系统与组件库,把设计令牌落地为可复用、可访问的组件。适用场景包括创建 Angular 组件库、构建使用设计令牌的组件、在 Angular 中建立设计系统、将设计稿转为 Angular 组件。
主要能力:覆盖现代 Angular 模式,包括 signal 输入 input()、事件输出 output()、双向绑定 model()、派生信号 computed()、@if/@for 控制流、standalone 组件;提供组件架构、TypeScript 集成、服务抽取共享状态与逻辑、消费设计令牌(CSS 自定义属性)等实践。
使用方式:按流程先识别组件类型(基础、复合或布局),再选择样式方案(组件样式、CSS Modules 或 Tailwind),定义输入输出(signal 输入配合 transform),通过样式或 host 绑定实现令牌,补充无障碍(ARIA、键盘处理、焦点管理),最后抽取服务。资料给出按钮、输入框、Stack 布局组件示例,主题服务(ThemeService)与焦点陷阱指令(FocusTrapDirective),以及推荐的项目目录结构(lib/components 下分 primitives、composite、layout,另有 services、directives、tokens)。
限制:资料未提供安装命令、版本要求、收费与价格、平台支持范围及实际效果说明;示例基于 Angular 17+ 特性,具体项目需自行确认兼容性。