Every time I click on the "go to page" button, it redirects me back to page 1. I recently switched to Angular 4, which is quite new to me since I started with Angular 1 a while ago.
The strange thing is that the console.log in the page component is logging multiple times. It first logs the correct page number, but then logs number 1 again. I've spent the whole day trying to figure it out, but it's just really weird.
Here is a snippet of my page:
<div class="portlet light">
<div class="portlet-title">
<div class="caption">
<div class="caption-subject bold uppercase" translate>PLAYER_INVENTORY</div>
</div>
</div>
<div class="portlet-body">
<!-- Code omitted for brevity -->
In my component.ts file:
import {Component, OnDestroy, OnInit, ViewChild} from '@angular/core';
import {ActivatedRoute, convertToParamMap} from '@angular/router';
import {Store} from '@ngrx/store';
import {Translation, TranslationService} from 'angular-l10n';
// Other import statements omitted for brevity
@Component({ selector: 'storever-inventory', templateUrl: './inventory.component.html', styleUrls: ['./inventory.component.scss'] })
export class InventoryComponent extends Translation implements OnInit, OnDestroy {
// Component code omitted for brevity
}
In my effect:
import {Injectable} from '@angular/core';
import {Response} from '@angular/http';
import {convertToParamMap, Params, Router} from '@angular/router';
import {Actions, Effect} from '@ngrx/effects';
// Other import statements omitted for brevity
@Injectable()
export class InventoryEffect extends BaseEffect {
// Effect code omitted for brevity
}
In my action:
import {Action} from '@ngrx/store';
// Action code omitted for brevity
Reducer:
import {Action} from '@ngrx/store';
// Reducer code omitted for brevity
This is my service:
import {Injectable} from '@angular/core';
import {Http} from '@angular/http';
import {Observable} from 'rxjs/Observable';
// Service code omitted for brevity