RSS Angular 博客 - Medium 关注 该网站似乎是 Angular 项目的官方博客，这是一个 Web 应用程序框架。首页显示了一份最近博客文章列表，标题包括“Angular 项目的 10 周年纪念”。常见的主题包括技术、开发和 Angular 本身。还有一个搜索栏、类别、标签和关于页面。它提供了与 Angular 框架相关的资源、更新和教程。 RSS blog.angular.dev Angular Blog - Medium blog.angular.dev
社区工程、代理式编码与真实用户组件测试 本周在开发生态方面取得了显著进展。重点聚焦于倡导以社区为先的工程方法，并探索人工智能对编码实践的影响。此外，相关资源还介绍了创新的浏览器测试技术。Dev Life 播客节目邀请了 Angular 社区经理，就社区驱动的工程策略展开讨论。一篇博文深入探讨了代理式编码（Agentic Coding），阐述了 AI 代理如何增强 Angular 的架构支持。一个教程演示了如何使用 Vitest 的全浏览器模式有效测试 Angular 组件，模拟真实用户交互。两则配有英文字幕的视频分别介绍了 Signal Forms 以及利用 Angular 编译器扩展诊断功能进行缺陷检测。一个代码示例展示了结合 Firebase 与 Angular 进行 AI 图像生成的方法，采用服务器提示模板（Server Prompt Templates）以确保操作安全。一个法语教程讲解了在 Angular v21 中通过 Signal Forms 恢复 CSS 类的方法。整体主题强调了社区贡献在构建和推进框架中的重要性。 Community Engineering, Agentic Coding, and Real-User Component Testing ️ blog.angular.dev
揭秘 A2UI：如何在您的应用中让 AI 代理“说 UI" 作者探讨了A2UI，一种新兴的代理接口构建协议，旨在向开发者解释其实现过程。A2UI使AI代理能够在网页、移动端和桌面端动态生成交互式用户界面，无需任意执行代码，实现无缝且便携的体验。与框架不同，A2UI是一种定义LLM代理与客户端应用之间通信的协议，允许开发者使用他们偏好的前端技术进行渲染。核心架构包括服务器端代理基于共享模式生成 UI 布局消息，客户端应用程序解释并渲染该消息。在服务器（代理）端，开发者必须提供若干关键输入：可用UI构建模块的目录（从基础元素到定义的JSON模式自定义组件）、指导代理何时以及如何使用特定UI的自然语言UI描述，以及示例以说明所需的JSON消息结构。此外，开发者还可以用“代理技能”来增强界面描述，以定义特定的用户能力和用例，并通过“动作映射”来处理用户交互，将事件转换为新的自然语言查询。代理工具虽然是通用的代理概念，但在执行数据获取或与API交互等任务时也至关重要。在客户端，尤其是在Angular应用中，主要的非样板要求是配置应用以渲染服务器端目录中定义的组件。如果只使用标准元素，基本目录即可。然而，如果代理生成自定义组件，客户端需要相应的 Angular 实现和一个自定义目录，扩展基础目录来注册这些组件。一个关键规则是，客户的组件定义必须与提供给代理的目录模式和示例完全一致，确保动态生成的UI能够准确呈现。 Demystifying A2UI: How to Make AI Agents “Speak UI” in Your App blog.angular.dev
社区反击，Angular 21.1 新功能，以及更智能的 Signal 表单 ⚡ 本周 Angular 社区汇总突出了生态系统内的个人故事与技术进展。Dev Life 播客讨论了 Angular 20 的工程决策以及应对技术裁员建议。Alain Chautard 简要回顾了 Angular 21.1 中的新功能与修复。Fanis Prodromou 提供了一篇教程，介绍如何在 Signal Forms 中通过异步验证器和防抖优化表单处理。Modeste Assiongbon 呈现了一份法语指南，讲解 Signal Forms 中的动态字段列表，并分享了与 Matthieu Riegler 的访谈，讲述他加入 Angular 核心团队的历程。Martine Dowden 解释了如何升级到 Angular 的现代控制流语法。社区被鼓励使用 #AngularSparkles 分享他们的里程碑。这些资源涵盖职业发展与技术实现。重点仍在于社区成长与共同学习。 Community Comebacks, Angular 21.1 Features, and Smarter Signal Forms ️⚡ blog.angular.dev
2026 年的 Angular：年中现实检验、信号与 AI 代码质量！ 如今已至 2026 年年中，促使我们回顾本年度框架预测。专家们正在重新评估其 2026 年 Angular 预测，以查看哪些已变为现实。借助模型上下文协议（Model Context Protocol），AI 辅助工具正在通过超越基础脚手架来理解工作空间，从而变革 Angular 开发。关于 Angular v21 的快速回顾已提供，并有一期视频专门探讨 AI 编写过时 Angular 代码的倾向。一门涵盖现代 Angular 功能与最佳实践的免费综合课程现已发布。开发者现在可以检查其 Angular 应用是否已准备好采用无区域（zoneless）架构。迈向无区域架构是高性能 Angular 应用的重要一步。信号的引入被强调为 Angular 开发中的重大架构转变。一期播客节目讨论了如何有效采用信号进行响应式编程。 Angular in 2026: Mid-Year Reality Check, Signals, and AI Code Quality! blog.angular.dev
宣布 Angular v22 Angular 已发布 22 版本，重点聚焦于稳定性与开发者体验。此次更新将三项重要功能推向生产就绪状态：Signal Forms、Angular Aria 以及异步响应式 API。Signal Forms 提供用于构建表单的可组合且响应式的解决方案，现已具备完整文档并回应了社区反馈。Angular Aria 为构建包容性 Web 应用提供可访问性原语，其 API 已稳定并附带测试工具集。异步响应式 API（包括新增的 resource 和 httpResource）使开发者能够在信号中利用异步编程，从而提升数据获取能力。此次发布还强调了 Angular 在 AI 开发中的角色，引入了用于代码创作和 AI 开发平台的代理工具。其中包括更新后的模型上下文协议（MCP）工具，以增强代理与开发服务器之间的交互，以及 Angular Agent Skills，为 AI 代理提供关于现代 Angular 开发的上下文信息。此外，还实验性支持了 WebMCP，允许在浏览器内为代理交互提供结构化工具暴露。同时，Angular 正在增强如 Google AI Studio 和 Gemini Canvas 等 AI 开发平台，以充分发挥该框架的优势。开发者可直接在浏览器中进行原型设计，并使用简化的提示词生成 Angular 应用。这些进展旨在使 Angular 成为构建下一代 Web 应用的坚实基石。 Announcing Angular v22 blog.angular.dev
掌握动态组件、HTTP 资源以及 AI 写作助手 本文介绍了多个 Angular 仓库，提供实用的学习体验。Antonio Cardenas 展示了如何使用 ViewContainerRef 实现高级动态组件创建，并提供了代码仓库和 StackBlitz 演示。他还提供了一个"Vibe Coding"模板，用于快速启动 CRUD 项目。Deborah Kurata 介绍了一个基于 Signal 的 httpResource，并附带"Pirates"示例。Ankit Sharma 演示了一个集成 Google Gemini 的 Angular 应用，实现实时语法纠正。这些示例非常适合学习最新的 Angular 模式并集成 AI 辅助。这些仓库涵盖了动态组件、CRUD 以及使用响应式原语进行数据获取等主题。这些资源专为初学者和有经验的 Angular 开发者设计。本文鼓励 Angular 社区分享自己的项目。开发者被提示使用相关标签分享其代码仓库和 StackBlitz 演示。强调协作与分享以促进社区成长。本文倡导通过代码探索和实际项目开展动手学习。 Mastering Dynamic Components, HTTP Resources, and AI Writing Assistants ️ blog.angular.dev
回归婴儿期联结：智能体、构建模块与 AI 工程的未来 作者是一位开发者，在从育儿假归来后，面对迅速演变的 AI 格局，尤其是智能体技能（agent skills）领域，产生了新的思考。智能体技能是指为 AI 智能体提供的一系列指令集合，促使作者重新审视其之前的项目——Angular AI 导师。该导师最初采用简单的规则文件与 Gemini 模型构建，以交互式方式教授 Angular。然而，随着项目逐步发展为交互式产品，其在课程连贯性和语法时效性方面遇到了挑战。此外，导师的逻辑高度耦合，导致可复用性差、更新困难。为此，作者提出了一种“路由器 + 构建块”的架构方案，旨在打造模块化、可复用的导师组件。如今，作者认为智能体技能有望成为实现“上下文管道工程”（Context Pipeline Engineering）这一愿景的载体。同时，作者也对这些系统的可扩展性、可靠性、令牌优化及稳定性提出了质疑。最终，作者深入探讨了 AI 工程中更为根本的结构性问题，并将这一新兴领域命名为“上下文管道工程”，邀请更多人共同参与探索。文章结尾，作者表达了对重返工作岗位、开启新项目的期待与兴奋。 Back from Baby Bonding: Agents, Building Blocks, and the Future of AI Engineering blog.angular.dev
AI 训练、本地 Gemini 以及样式信号表单 Angular 社区正通过人工智能（AI）与无障碍技术推动创新，开发者们正在探索构建更智能、更美观应用的新方法。Fanis Prodromou 演示了如何利用 Angular Signal Forms 和自定义 CSS 实现表单状态的自动样式化。Daniel Herrera Sanchez 展示了一款名为"Mind Palace AI"的认知训练应用，该应用基于 Angular 和 Gemini 3.0 构建。Mariano Alvarez 就在使用 Angular 项目中的 Gemini CLI 时如何减少 AI 幻觉提供了指导，并解释了如何利用 Chrome 的 AI 能力，在 Angular 应用中本地、免费地运行 Gemini。Connie Leung 分享了一个使用 Google Nano Banana 和 Firebase AI 开发的图片编辑应用代码示例，她还展示了一个利用 Gemini 2.5 Flash TTS 构建的 AI 替代文本生成器和文本转语音工具，以提升无障碍体验。这些案例凸显了图像处理和文本转语音功能的最新进展。我们鼓励开发者分享其 AI 与无障碍项目，请使用标签 #AngularSparkles 和 #AngularAI。 AI Training, Local Gemini, and Styling Signal Forms blog.angular.dev
掌握动态组件、HTTP 资源以及 AI 写作助手 本周的重点是通过代码示例进行实用的 Angular 学习。多个仓库展示了现代 Angular 模式以及 Google Gemini 的集成应用。其中一个仓库演示了如何使用 ViewContainerRef 实现可扩展的高级动态组件创建；另一个提供了现成的 CRUD 模板，以加速项目开发。基于 Signals 的 httpResource 通过"Pirates"示例展示了数据管理方案。一款由 AI 驱动的语法助手应用集成了 Google Gemini，实现实时纠错。这些动手实践的案例为在 Angular 应用中融入 AI 提供了蓝图。作者鼓励开发者分享自己的 Gemini 和 httpResource 项目，并建议使用指定的标签展示个人项目。这种协作方式有助于提升 Angular 社区的学习氛围。这些示例非常适合学习与构建。提供的 GitHub 链接可直接探索代码实现。 Mastering Dynamic Components, HTTP Resources, and AI Writing Assistants ️ blog.angular.dev
Angular 2025 年夏季更新 Angular 已发布 v20.1 和 v20.2 次要更新，重点关注开发者生产力和 AI 增强功能。一个主要亮点是无区域（zoneless）Angular 的生产就绪，它提供了更小的包体积和更好的调试体验等好处。新的动画基元 animate.enter 和 animate.leave 允许更容易地集成原生 CSS 动画，并弃用了旧的 @angular/animations 包。团队正在通过构建 AI 驱动应用程序的指南和改进 AI 辅助编码工具来扩展 AI 产品。他们还在开发一个实验性的 MCP 服务器，以支持文档搜索和 LLM 的最佳实践等 AI 需求。Angular DevTools 现在包括路由可视化和信号图，以提供更好的调试。通过支持将绑定对象传递给 TestBed.createComponent，组件测试得到了简化。Mat Menu 组件现在可以充当上下文菜单，而 NgComponentOutlet 支持动态组件的自定义 EnvironmentInjectors。其他改进包括改进的路由指南、新的 currentNavigation 信号、DestroyRef 上的 destroyed 属性，以及对模板运算符和 ARIA 属性的更好支持。Angular 现在支持 TypeScript 5.9，并在 httpResource 和 httpClient 方面进行了改进。社区为新的 Angular 吉祥物提供了重要的反馈，最终设计将在今年晚些时候公布。 Angular Summer Update 2025 blog.angular.dev
