2

我正在使用 Angular 2 和 @ngrx/store 的项目中使用。我还使用 @ngrx/devtools 来调试并帮助我使用这个 redux 实现。

我想将 angular 的路由器与 ngrx 的商店绑定。所以我将能够通过调度一个动作来更新当前路线。

语境

这就是我所做的（它有效，但这不是我想要的）：

// imports
// ....
// @Component
// ....

@RouteConfig([
    { path: '/home',    name: 'Home',   component: HomeComponent,   useAsDefault: true },
    { path: '/medias',  name: 'Medias', component: MediasComponent }
])
export class MainComponent {
    constructor (private _router:Router, private _store:Store<AppStore>) {
        _router.subscribe(url => _store.dispatch(changeUrl(url)));
    }
}

changeUrl是一个动作创建者。

因此，当 Angular 检测到路由更新时，会调度一个动作并且我的状态正在更新。

而且效果很好！使用@ngrx/devtools，我可以看到正确调度的动作，商店已更新但是..这与我想要的相反，因为angular完成了工作并更新了redux。所以如果我回滚一个动作，我的视图不会更新。

这很简单 ！

“我所要做的就是在点击动作创建器内的导航链接时调度一个动作，使用 Angular 的方法重定向。”

是的。但是不，我认为这不是一个好方法，因为：

  • <a [routerLink]="routeName">Link</a>Angular 提供的功能变得毫无用处。
  • 似乎很难使用 Angular 的 DI 来注入Router我的动作创建者，因为动作创建者基本上是函数。不是角度的组件。

该怎么办 ？

这就是问题。我真的不知道如何正确绑定 Angular 的路由器和 @ngrx/store。

4

0 回答 0