默认路由解析器（Angular）

Question

我正在尝试在 NgRx Store 中为特定页面设置一些状态（我将导致这些 POI - “感兴趣的页面”）。如果不是这些页面之一，我想将商店设置为默认值。我们有很多页面，因此我希望根页面有一个默认路由解析器，并为子 POI 有专门的路由解析器。这可能吗？

我遇到的问题是从 POI 页面切换到非 POI 页面应该将状态恢复为默认状态。

const ROOT_PATH = 'root';
const PAGE_PATH = `${ROOT_PATH}/page`;

function valueFromStore(): boolean {
  return getFromPage(Store).selectSignal(myValueSelector)();
}

function verifiedNavigate(url: string) {
  get(Router).navigateByUrl(url);
  flush();
}

describe('PermissionsResolver', () => {
  beforeEach(() => {
    bootstrapPageTest({
      routes: [
        {
          path: ROOT_PATH,
          component: PageComponent,
          resolve: {
            'my_resolver': defaultResolver, // sets the store value to false
          },
          children: [
            {
              path: 'page',
              component: PageComponent,
              resolve: {
                'my_resolver': overrideResolver, // sets the store value to true
              },
            },
          ],
        },
      ],
      // omitted extra stuff
    });
  });

  // This test fails
  it('sets the store to false when switching to an unsupported page', () => {
    verifiedNavigate(PAGE_PATH);
    expect(valueFromStore()).toBeTrue();

    verifiedNavigate(ROOT_PATH);
    expect(valueFromStore()).toBeFalse();
  });
});

Answer 1

您可以

fakeAsync and flush

测试用例吗，因为减速器更新是异步的。

it('sets the store to false when switching to an unsupported page', fakeAsync(() => {
  verifiedNavigate(PAGE_PATH);
  expect(valueFromStore()).toBeTrue();
  flush();
  verifiedNavigate(ROOT_PATH);
  expect(valueFromStore()).toBeFalse();
}));