宣布 NgRx 21：庆祝十年旅程以及全新面貌和 @ngrx/signals/events
Source: Dev.to
请提供您希望翻译的正文内容，我将按照要求保留源链接、格式和技术术语，仅翻译文本部分。
10 年纪念 🎉
十年前，NgRx 作为一个小实验由 Rob Wormald、Mike Ryan 和 Brandon Roberts 发起，旨在为 Angular 应用引入 Redux 风格的状态管理。此后，Angular 发生了巨大变化，我们的工具链也有了很大改进，构建应用的方式同样翻天覆地——但 NgRx 仍然是我们在 Angular 中管理状态时首选的解决方案。
多年来，NgRx 已从 @ngrx/store 发展为一个完整平台：路由集成、实体帮助函数、开发者工具、组件实用工具、ESLint 规则，以及最近的 Signals。
特别感谢 Alex Okrushko、Brandon Roberts、Marko Stanimirović、Mike Ryan、Rainer Hahnekamp、Tim Deschryver，以及一路上所有在团队中的成员和众多贡献者。同样重要的是无数内容创作者，他们帮助我们学习如何更好地使用这些工具。
如果你在过去十年里使用过 NgRx，你就是这段历史的一部分。谢谢你。 🙏
一些关键数字，凸显 NgRx 为生产级应用带来的价值：
- 483 位贡献者
- 2 250 次提交
- 2 400 个已关闭的问题
@ngrx/store has been downloaded 174 070 253 times
@ngrx/signals has been downloaded 14 665 960 times新网站 🎨
为了庆祝这一里程碑，我们发布了全新改版的网站，地址为 。
新站点使用 Analog 构建，拥有现代化的外观和体验、改进的导航以及更佳的性能。我们还在更新文档和示例，使您更容易找到所需内容，无论是刚入门还是寻找高级模式。
特别感谢 Mike Ryan 的全新设计和搭建，以及 Brandon Roberts、Duško Perić 和 Tim Deschryver 对内容迁移和改进所做的贡献。
Welcome Rainer 🏆
We are thrilled to welcome Rainer to the NgRx core team! Rainer has been an active member of the NgRx community for years—giving talks and workshops at conferences and meet‑ups, contributing code, documentation, and support to fellow developers. His expertise and passion for Angular and NgRx make him a valuable addition to our team. Please join us in welcoming Rainer to the NgRx family!
Events 插件已稳定 👏
在 NgRx 19 中，我们引入了 @ngrx/signals/events，作为一种使用 Signals 和 Signal Stores 在 Angular 应用中建模事件驱动工作流的实验性方式。
感谢大家的反馈，API 已经清理完毕，粗糙的边缘也已打磨平滑。我们现在有足够的信心在本次发布中将 Events 插件提升为 stable（稳定版）。
如果你想了解如何在应用中使用 Events 插件，请查看 Events 文档。
作用域事件
最重要的新增功能是对 作用域事件 的支持。与全局广播每个事件不同，你可以将事件限定在应用的特定部分——本地作用域、父级作用域或全局作用域。典型的例子包括本地状态管理场景，事件应当局限在某个特定功能内部；或微前端架构中，每个远程模块需要各自独立的事件作用域。
import { provideDispatcher } from '@ngrx/signals/events';
@Component({
providers: [
// 👇 Provide local `Dispatcher` and `Events` services
// at the `BookSearch` injector level.
provideDispatcher(),
BookSearchStore,
],
})
export class BookSearch {
readonly store = inject(BookSearchStore);
readonly dispatch = injectDispatch(bookSearchEvents);
constructor() {
// 👇 Dispatch event to the local scope.
this.dispatch.opened();
}
changeQuery(query: string): void {
// 👇 Dispatch event to the parent scope.
this.dispatch({ scope: 'parent' }).queryChanged(query);
}
triggerRefresh(): void {
// 👇 Dispatch event to the global scope.
this.dispatch({ scope: 'global' }).refreshTriggered();
}
}想了解更多关于作用域事件的内容，请查阅 作用域事件文档。
signalMethod 和 rxMethod 接受计算方法
除了提供 Signal 之外，现在还可以向 signalMethod 和 rxMethod 传入计算函数。此小改动提升了开发者体验，并使我们的 API 与 Angular 的 resource 和 linkedSignal 方法保持一致。
@Component({
/* ... */
})
export class Numbers {
readonly logSum = signalMethod(
({ a, b }) => console.log(a + b)
);
constructor() {
const num1 = signal(1);
const num2 = signal(2);
this.logSum(() => ({ a: num1(), b: num2() }));
// console output: 3
setTimeout(() => num1.set(3), 3_000);
// console output after 3 seconds: 5
}
}特别感谢 Rainer 和 Marko 在 @ngrx/signals 上的卓越工作！
更新到 NgRx v21 🚀
要开始使用 NgRx 21，请确保已安装以下最低版本：
- Angular 21.x
- Angular CLI 21.x
- TypeScript 5.9.x
- RxJS
^6.5.x或^7.5.x
更新 NgRx 包
NgRx 支持使用 Angular CLI 的 ng update 命令来更新 NgRx 包。
要将包更新到最新版本，请运行以下命令：
ng update @ngrx/store@21
ng update @ngrx/signals@21对我们社区的衷心感谢！ ❤️
NgRx 是一个社区驱动的项目，我们对所有贡献时间和专业知识的朋友们深表感激。正是你们的错误报告、功能请求、文档改进和 Pull Request 让这个项目蓬勃发展。
特别致谢
- Duško Perić – 改进网站设计
- Exequiel Ceasar Navarrete、Gabriel Guerrero、Julien Michel、以及 Mateusz Stefańczyk – 将测试套件迁移到 Vitest
- J. Degand – 生活质量改进
赞助商
我们也要向赞助商致以衷心的感谢。你们的资金支持对 NgRx 的持续开发和维护至关重要。
- 金牌赞助商： Nx
- 铜牌赞助商： House of Angular
如果您有兴趣赞助 NgRx 的持续开发，请访问我们的 GitHub Sponsors 页面 了解不同的赞助选项，或直接联系我们讨论其他赞助机会。
接下来怎么办？
我们对您使用 NgRx v21 所能构建的内容感到非常兴奋。我们鼓励您尝试新功能并向我们反馈意见。我们尤其希望了解您对全新实验性 Events 插件的看法。请在我们的 GitHub 仓库 上打开 issue 或参与讨论，告诉我们您的想法。
想要获取最新动态，请关注我们：
感谢您成为 NgRx 社区的一员！祝编码愉快！