Question

仍然试图围绕RxJs / Observables的工作原理，所以这可能是一个非常基本的问题。

我正在尝试修改Angular组件（顶部导航栏）以基于ngrx存储中的值显示链接。当前，传递给导航栏组件的是静态链接数组。

还有一个用于初始化此列表的布局组件。

这是我所拥有的片段：

export class LayoutContainer implements OnDestroy {
  links: Link[] = [  // list of links
    {
      label: 'SESSIONS',
      path: '/sessions'
    },
    {
      label: 'BOOKINGS',
      path: '/bookings'
    },
    {
      label: 'ACCOUNT',
      path: '/account'
    }
  ];


constructor( private store: Store<fromAccount.State>
  ) {

    this.clubAdminList$ = store.pipe(
      select(fromAccount.getUserClubAdminList)
    );
  }

“ clubAdminList”是我从商店中获取的东西。如何根据该clubAdminList中的值动态修改链接列表？

Answer 1

我有点不确定IDisposable返回什么类型的数据，所以我只能给您广泛的看法。

有两种方法。

1。

getUserClubAdminList

2。

constructor( private store: Store<fromAccount.State>
  ) {

    store.pipe(
      select(fromAccount.getUserClubAdminList)
    ).subscribe(x => {
        this.links = x.map(u => ........ <do whatever you need to adhere to Link interface>
    });
  }

<nav class="nav navbar">
    <a *ngFor="clubAdminList$ | async as link" routerLink="{{link.path}}"> {{ link.label }} </a>
</nav>

如何基于NgRx存储中的值动态修改列表？

1 个答案: