TypeScript Store.first方法代碼示例

 subractMinutes(value) {
   this.store.first().subscribe(state => {
     const time = state.search.time.time;
     const newTime = subtractMinutes(time, value);
     this.store.dispatch(new ChangeDatetime(newTime))
   });
 }

 subtractDay() {
   this.store.first().subscribe(state => {
     const date = state.search.time.time;
     const dateDate = subtractDay(date);
     this.store.dispatch(new ChangeDatetime(dateDate))
   });
 }

 confirmBook() {
   this.store
     .first()
     .map(state => state.search.result.response.tripId)
     .subscribe(tripId => {
       this.store.dispatch(new ConfirmBook({ tripId }))
     })
 }

  switchInputs() {
    this.store.first().subscribe(state => {
      const originAddress = state.search.origin.address;
      const originCoords = state.search.origin.coords;
      const destinationAddress = state.search.destination.address;
      const destinationCoords = state.search.destination.coords;

      this.destinationChange(originAddress, originCoords);
      this.originChange(destinationAddress, destinationCoords);
      this.updateInputFocus();
    });
  }

 updateInputFocus() {
   this.store.first().subscribe(state => {
     if (state.search.origin.address.length === 0) {
       // console.log("this happened 320")
       this.originFocus();
     } else if (state.search.destination.address.length === 0) {
       this.destinationFocus();
     } else {
       this.noFocus();
     }
   });
 }

  public hmrOnDestroy(store): void {
    var cmpLocation = this.appRef.components.map(cmp => cmp.location.nativeElement);
    // recreate elements
    store.disposeOldHosts = createNewHosts(cmpLocation);
    // save input values
    ///store.restoreInputValues  = createInputTransfer();
    // remove styles
    removeNgStyles();

    this.appStore
      .first()
      .subscribe(snapshot => store.state = snapshot);
  }

 backOneStep() {
   this.store.first().subscribe(state => {
     let newProgress: string;
     switch (state.search.progress) {
       case ProgressSteps.PENDING_1:
       case ProgressSteps.VIEWING_RESULT:
       case ProgressSteps.ERROR_1:
         newProgress = ProgressSteps.NO_SEARCH;
         break;
       case ProgressSteps.READING_INFO:
         newProgress = ProgressSteps.VIEWING_RESULT;
         break;
       case ProgressSteps.PENDING_2:
       case ProgressSteps.NO_SEARCH:
       case ProgressSteps.BOOKING_SUCCESS:
       case ProgressSteps.ERROR_2:
         break;
     }
     this.store.dispatch(new NavigateToStep(newProgress))
   });
 }

  searchSubmit() {
    this.store.first().subscribe(state => {
      const request: TripQueryRequest = {
        originAddress: state.search.origin.address,
        originCoords: state.search.origin.coords,
        destinationAddress: state.search.destination.address,
        destinationCoords: state.search.destination.coords,
        time: state.search.time.time,
        timeTarget: state.search.time.timeTarget
      };
      this.store.dispatch(new SubmitQuery(request));
    });

    // this.ngRedux.dispatch({ type: SEARCH_SUBMIT });
    // this.ngRedux.dispatch({ type: MAP_RENDERING_START });

    // const state: IAppState = this.ngRedux.getState();
    //
    // if (state.searchOriginAddress && state.searchDestinationAddress) {
    //   // TODO: check if new trip query is the same as the old trip query before sending
    //   // TODO: throttle events when requests keep changing? Client side or server side?
    //
    //   const tripQueryRequest = buildTripQueryRequest(state);
    //   this.http.post('http://localhost:3000/api/trip-query', tripQueryRequest).subscribe(response => {
    //     const tripQueryResponse = parseTripQueryResponse(response);
    //
    //     this.ngRedux.dispatch({ type: SEARCH_RESULT_RECEIVED, body: tripQueryResponse });
    //     this.ngRedux.dispatch({ type: MAP_RENDERING_STOP });
    //
    //     // TODO: refactor into a better function, also account for possibly the destination being current location
    //
    //     // update address or keep as current location
    //
    //     this.ngRedux.dispatch({ type: SEARCH_DESTINATION_CHANGE, body: {
    //       address: tripQueryResponse.destinationAddress,
    //       coords: tripQueryResponse.destinationCoords
    //     }});
    //   }, (err) => {
    //     console.log(err);
    //   });
    //
    //   // setTimeout(() => {    // fake right now
    //   //   this.ngRedux.dispatch({ type: SEARCH_RESULT_RECEIVED, body: tripQueryResponse });
    //   //   this.fitboundsService.setMapBounds();
    //   //
    //   //   this.mapService.addWalking1Directions(
    //   //     tripQueryResponse.startLocation,
    //   //     tripQueryResponse.station1Location);
    //   //
    //   //   this.mapService.addBikeDirections(
    //   //     tripQueryResponse.station1Location,
    //   //     tripQueryResponse.station2Location);
    //   //
    //   //   this.mapService.addWalking2Directions(
    //   //     tripQueryResponse.station2Location,
    //   //     tripQueryResponse.endLocation);
    //   //
    //   //   // TODO: get directions on the server side, send list of points back with the response data
    //   //
    //   //   this.ngRedux.dispatch({ type: MAP_RENDERING_STOP });
    //   //
    //   // }, 100)
    //
    //   // setTimeout(() => {
    //   //   this.ngRedux.dispatch({ type: SEARCH_ERROR_RECEIVED , body: 'Error message' })
    //   // }, 1000)
    // } else {
    //   // this.ngRedux.dispatch({ type: SEARCH_CANCEL_FETCH });
    //   this.ngRedux.dispatch({ type: MAP_RENDERING_STOP });
    // }
  }