TypeScript store.Actions类代码示例

    it('should dispatch CredentialsExpiredAction when credentials have expired or are invalid (401)', () => {
        const errorResponse = new HttpErrorResponse({
            status: 401,
            error: {
                error: 'expired/invalid'
            },
            statusText: '401 Unauthenticated'
        });

        const route = '/api/error401';
        client.get(route).subscribe(
            (response) => {
                expect(response).toBeFalsy();
            },
            (error) => {
                expect(error).toBeTruthy();
                expect(error.error).toBe('expired/invalid');
            }
        );

        actions.pipe(ofActionDispatched(CredentialsExpiredAction)).subscribe((payload: any) => {
            expect(payload).toBeTruthy();
            expect(payload instanceof CredentialsExpiredAction).toBe(true);
        });

        backend.expectOne(route).flush({}, errorResponse);

        expect(toastrSpy).toHaveBeenCalledTimes(0);
    });

  ngxsOnInit({ dispatch }: StateContext<ShopProductsModel>) {
    concat(
      this.stateService.getInitialState('', 'products').pipe(take(1)),
      /* LOGIN: */
      this.store$.select(UserState.isLoggedIn).pipe(
        pairwise(),
        filter(([wasLoggedIn, isLoggedIn]) => !wasLoggedIn && isLoggedIn),
        switchMap(() => this.stateService.getInitialState('', 'products').pipe(take(1)))
      )
    ).subscribe((products) => {
      dispatch(new InitShopProductsAction(products));
    });

    // Update products from server on entry update (name, attribute, instock, reservations)
    this.actions$.pipe(
      ofActionSuccessful(UpdateSectionEntryFromSyncAction),
      filter(action => {
        const actions = ['cartTitle', 'cartPrice', 'cartAttributes'];
        const prop = action.path.split('/').pop();
        return actions.indexOf(prop) > -1;
      }),
      switchMap(() => this.stateService.getInitialState('', 'products', true).pipe(take(1)))

    ).subscribe((products) => {
      dispatch(new InitShopProductsAction(products));
    });
  }

 handleUntrackedImage(image: IMergedImageDto) {
   this.store.dispatch(new CreateImageByPath(image.absolutePath, image.name, image.extension));
   this.actions$.pipe(
     ofActionSuccessful(ImageCreated),
     first()
   ).subscribe((action: ImageCreated) => {
     this.toastr.success(`Bild "${action.createdImage.name}.${action.createdImage.extension}" hinzugefĂźgt`);
   });
 }

 handleUntrackedFolder(folder: IMergedFolderDto) {
   this.store.dispatch(new CreateFolderByPath(folder.absolutePath));
   this.actions$.pipe(
     ofActionSuccessful(FolderCreated),
     first()
   ).subscribe((action: FolderCreated) => {
     this.toastr.success(`Ordner "${action.createdFolder.name}" hinzugefĂźgt`);
   });
 }

 ngxsOnInit({ dispatch }: StateContext<SectionTagsStateModel>) {
   concat(
     this.appStateService.getInitialState('', 'section_tags').pipe(take(1)),
     this.actions$.pipe(ofActionSuccessful(UserLoginAction), switchMap(() => {
       return this.appStateService.getInitialState('', 'section_tags').pipe(take(1));
     }))
   )
   .subscribe((sectionTags) => {
     dispatch(new InitSiteSectionsTagsAction(sectionTags));
   });
 }

 ngxsOnInit({ dispatch }: StateContext<SitesSettingsStateModel>) {
   concat(
     this.appStateService.getInitialState('', 'site_settings').pipe(take(1)),
     this.actions$.pipe(ofActionSuccessful(UserLoginAction), switchMap(() => {
       return this.appStateService.getInitialState('', 'site_settings').pipe(take(1));
     }))
   )
   .subscribe({
     next: (response: SiteSettingsResponse) => {
       dispatch(new InitSiteSettingsAction(response));
     },
     error: (error) => console.error(error)
   });
 }

  ngxsOnInit({ getState, dispatch }: StateContext<AppStateModel>) {
    this.router.events.pipe(
      filter(evt => evt instanceof ActivationEnd)
    ).subscribe((event: ActivationEnd) => {
      const state = {...getState()};
      const newSiteName = event.snapshot.queryParams['site'] || '';
      const newSectionName = !event.snapshot.queryParams['section'] ? null : event.snapshot.queryParams['section'];

      // Set current site and section
      if (state.site !== newSiteName || state.section !== newSectionName) {
        dispatch(new UpdateAppStateAction({site: newSiteName, section: newSectionName}));
      }
    });

    this.router.events.pipe(
      filter(event => event instanceof NavigationEnd),
      map((event: NavigationEnd) => event.url.split('?')[0]),
      filter(url => url !== '/' && url !== '/login')
    ).subscribe((url: string) => {
      dispatch(new UpdateAppStateAction({lastRoute: url}));
    });

    this.appStateService.getAppMetadata().pipe(take(1))
      .subscribe({
        next: (metadata) => {
          dispatch(new UpdateAppStateAction(metadata));
        },
        error: (error) => console.error(error)
      });

    concat(
      this.appStateService.getInitialState('').pipe(take(1)),
      // After each subsequent successful login, initialize the state
      this.actions$.pipe(
        ofActionSuccessful(UserLoginAction),
        switchMap(() => this.appStateService.getInitialState('').pipe(take(1)))
      )
    )
    .subscribe({
      next: (response) => {
        dispatch(new InitAppStateAction({urls: response.urls}));
      },
      error: (error) => console.error(error)
    });
  }

  connectIframeReload(iframe: HTMLIFrameElement) {
    /*
      Catch external links and prevent navigating away from iframe
    */
    this.catchExternalLinks(iframe.contentWindow.document);

    /*
      Reload the preview iframe after settings affecting preview change
      Because we don't have preview renderer in frontend yet.
     */
    this.iframeReloadSubscription = this.actions$.pipe(
      ofActionSuccessful(
        ...[
          CreateSiteAction,
          UpdateSiteAction,
          ReOrderSitesAction,
          DeleteSiteAction,
          AddSiteSectionsAction,
          UpdateSiteSectionAction,
          RenameSiteSectionAction,
          ReOrderSiteSectionsAction,
          DeleteSiteSectionAction,
          DeleteSiteSectionsAction,
          UpdateSiteSettingsAction,
          UpdateSiteTemplateSettingsAction
        ]
      ),
      /* Only reload when the overlay gets closed: */
      buffer(this.store.select(AppState.getShowOverlay).pipe(
        scan(([_, prevShowOverlay]: [boolean, boolean], showOverlay: boolean) => {
          return [prevShowOverlay, showOverlay];
        }, [false, false]),
        filter(([prev, cur]) => prev !== cur && !cur)
      )),
      filter(actionsPassed => actionsPassed.length > 0),
    ).subscribe(() => {
      iframe.contentWindow.location.reload();
    });
  }

  ngxsOnInit({ dispatch }: StateContext<SiteSettingsConfigStateModel>) {
    concat(
      this.appStateService.getInitialState('', 'siteSettingsConfig').pipe(take(1)),
      this.actions$.pipe(ofActionSuccessful(UserLoginAction), switchMap(() => {
        return this.appStateService.getInitialState('', 'siteSettingsConfig').pipe(take(1));
      }))
    )
    .subscribe({
      next: (siteSettingsConfig: SiteSettingsConfigResponse) => {
        dispatch(new InitSiteSettingsConfigAction(siteSettingsConfig));
      },
      error: (error) => console.error(error)
    });

    // Listen for language change
    this.store.select(SiteSettingsState.getCurrentSiteLanguage).pipe(
      pairwise(),
      filter(([prevLang, lang]) => !!prevLang && !!lang && prevLang !== lang),
      switchMap(([, language]) => this.appStateService.getLocaleSettings(language, 'siteSettingsConfig').pipe(take(1)))
    ).subscribe((siteSettingsConfig: SiteSettingsConfigResponse) => {
      dispatch(new InitSiteSettingsConfigAction(siteSettingsConfig));
    });
  }