docs(component-store): prevent emitting changes on initialization in …

…MatPaginator example (#3164) Closes #2921
ngrx · Oct 6, 2021 · a03666b · a03666b
1 parent 605fd02
commit a03666b
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/...cts/ngrx.io/content/examples/component-store-paginator-service/src/app/paginator.store.ts b/...cts/ngrx.io/content/examples/component-store-paginator-service/src/app/paginator.store.ts
@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
 import { ComponentStore } from '@ngrx/component-store';
-import { filter, tap, map, withLatestFrom, pairwise } from 'rxjs/operators';
+import { filter, tap, map, withLatestFrom, pairwise, skip } from 'rxjs/operators';
 import { Observable } from 'rxjs';
 
 export interface PaginatorState {
@@ -145,6 +145,9 @@ export class PaginatorStore extends ComponentStore<PaginatorState> {
     }),
     // debounce, so that we let the state "settle"
     { debounce: true }
+  ).pipe(
+    // Skip the emission of the initial state values
+    skip(1)
   );
   // #enddocregion selectors
 

diff --git a/projects/ngrx.io/content/examples/component-store-paginator/src/app/paginator.component.ts b/projects/ngrx.io/content/examples/component-store-paginator/src/app/paginator.component.ts
@@ -7,7 +7,7 @@ import {
   ViewEncapsulation,
 } from '@angular/core';
 import { ComponentStore } from '@ngrx/component-store';
-import { filter, tap, withLatestFrom, map, pairwise } from 'rxjs/operators';
+import { filter, tap, withLatestFrom, map, pairwise, skip } from 'rxjs/operators';
 
 export interface PaginatorState {
   /** The current page index. */
@@ -92,6 +92,9 @@ export class PaginatorComponent {
     }),
     // debounce, so that we let the state "settle" before emitting a value
     { debounce: true }
+  ).pipe(
+    // Skip the emission of the initial state values
+    skip(1)
   );
 
   // *********** Updaters *********** //