Angular 用户界面模式用于构建针对 AI 代理和大语言模型优化的稳健 Angular 应用的现代 UI 模式。概览此技能涵盖以下必要的用户界面模式加载状态- 骨架屏与加载旋转图的决策树错误处理- 错误边界层级和恢复渐进式显示- 使用defer进行延迟渲染数据展示- 处理空、加载和错误状态表单模式- 提交状态和验证反馈对话/模态模式- 合理的对话生命周期管理核心原则永远不要显示过时的界面- 仅在没有数据时显示加载显示所有错误- 永不悄悄失败乐观更新- 在服务器确认前更新用户界面渐进式披露- 使用defer加载非关键内容优雅降级- 功能失败时的备用方案结构SKILL.md文件包括黄金法则- 不可妥协的遵循模式决策树- 何时使用骨架与旋转器代码示例- 正确与错误的实现反模式- 需要避免的常见错误快速参考!-- Angular template pattern for data states --if (error()) {app-error-state[error]error()(retry)load()/} else if (loading() !data()) {app-skeleton-state/} else if (!data()?.length) {app-empty-statemessageNo items found/} else {app-data-display[data]data()/}版本当前版本1.0.02026年2月参考文献Angular deferAngular Templates