• Home
  • Features
  • Pricing
  • Docs
  • Announcements
  • Sign In

IgniteUI / igniteui-angular / 16193550997

10 Jul 2025 11:12AM UTC coverage: 4.657% (-87.0%) from 91.64%
16193550997

Pull #16028

github

web-flow
Merge f7a9963b8 into 87246e3ce
Pull Request #16028: fix(radio-group): dynamically added radio buttons do not initialize

178 of 15764 branches covered (1.13%)

18 of 19 new or added lines in 2 files covered. (94.74%)

25721 existing lines in 324 files now uncovered.

1377 of 29570 relevant lines covered (4.66%)

0.53 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

5.8
/projects/igniteui-angular/src/lib/paginator/paginator.component.ts
1
import { ChangeDetectorRef, Component, ContentChild, Directive, ElementRef, EventEmitter, Host, HostBinding, Input, Output, forwardRef } from '@angular/core';
2
import { IPageCancellableEventArgs, IPageEventArgs } from './paginator-interfaces';
3
import { IPaginatorResourceStrings, PaginatorResourceStringsEN } from '../core/i18n/paginator-resources';
4
import { OverlaySettings } from '../services/overlay/utilities';
5
import { IgxSelectItemComponent } from '../select/select-item.component';
6
import { FormsModule } from '@angular/forms';
7
import { IgxSelectComponent } from '../select/select.component';
8
import { IgxIconComponent } from '../icon/icon.component';
9
import { IgxRippleDirective } from '../directives/ripple/ripple.directive';
10
import { getCurrentResourceStrings } from '../core/i18n/resources';
11
import { IgxIconButtonDirective } from '../directives/button/icon-button.directive';
12
import { IgxPaginatorToken } from './token';
13

14
@Directive({
15
    selector: '[igxPaginatorContent],igx-paginator-content',
16
    standalone: true
17
})
18
export class IgxPaginatorContentDirective {
3✔
19
    /**
20
     * @internal
21
     * @hidden
22
     */
23
    @HostBinding('class.igx-paginator-content')
UNCOV
24
    public cssClass = 'igx-paginator-content';
×
25
}
26

27
/* blazorElement */
28
/* mustUseNGParentAnchor */
29
/* wcElementTag: igc-paginator */
30
/* blazorIndirectRender */
31
/* singleInstanceIdentifier */
32
/* contentParent: GridBaseDirective */
33
/* contentParent: RowIsland */
34
/* contentParent: HierarchicalGrid */
35
/* jsonAPIManageCollectionInMarkup */
36
/**
37
 * Paginator component description
38
 * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, *
39
 */
40
@Component({
41
    selector: 'igx-paginator',
42
    templateUrl: 'paginator.component.html',
UNCOV
43
    imports: [forwardRef(() => IgxPageSizeSelectorComponent), forwardRef(() => IgxPageNavigationComponent)],
×
44
    providers: [
45
        { provide: IgxPaginatorToken, useExisting: IgxPaginatorComponent }
46
    ]
47
})
48
// switch IgxPaginatorToken to extends once density is dropped
49
export class IgxPaginatorComponent implements IgxPaginatorToken {
3✔
50

51
    /**
52
     * @hidden
53
     * @internal
54
     */
55
    @ContentChild(IgxPaginatorContentDirective)
56
    public customContent: IgxPaginatorContentDirective;
57

58
    /**
59
     * Emitted when `perPage` property value of the paginator is changed.
60
     *
61
     * @example
62
     * ```html
63
     * <igx-paginator (perPageChange)="onPerPageChange($event)"></igx-paginator>
64
     * ```
65
     * ```typescript
66
     * public onPerPageChange(perPage: number) {
67
     *   this.perPage = perPage;
68
     * }
69
     * ```
70
     */
71
    @Output()
UNCOV
72
    public perPageChange = new EventEmitter<number>();
×
73

74
    /**
75
     * Emitted after the current page is changed.
76
     *
77
     * @example
78
     * ```html
79
     * <igx-paginator (pageChange)="onPageChange($event)"></igx-paginator>
80
     * ```
81
     * ```typescript
82
     * public onPageChange(page: number) {
83
     *   this.currentPage = page;
84
     * }
85
     * ```
86
     */
87
    @Output()
UNCOV
88
    public pageChange = new EventEmitter<number>();
×
89

90
    /**
91
     * Emitted before paging is performed.
92
     *
93
     * @remarks
94
     * Returns an object consisting of the current and next pages.
95
     * @example
96
     * ```html
97
     * <igx-paginator (paging)="pagingHandler($event)"></igx-paginator>
98
     * ```
99
     */
100
    @Output()
UNCOV
101
    public paging = new EventEmitter<IPageCancellableEventArgs>();
×
102

103
    /**
104
     * Emitted after paging is performed.
105
     *
106
     * @remarks
107
     * Returns an object consisting of the previous and current pages.
108
     * @example
109
     * ```html
110
     * <igx-paginator (pagingDone)="pagingDone($event)"></igx-paginator>
111
     * ```
112
     */
113
    @Output()
UNCOV
114
    public pagingDone = new EventEmitter<IPageEventArgs>();
×
115

116
    /**
117
     * Total pages calculated from totalRecords and perPage
118
     */
119
    public totalPages: number;
UNCOV
120
    protected _page = 0;
×
121
    protected _totalRecords: number;
UNCOV
122
    protected _selectOptions = [5, 10, 15, 25, 50, 100, 500];
×
UNCOV
123
    protected _perPage = 15;
×
124

UNCOV
125
    private _resourceStrings = getCurrentResourceStrings(PaginatorResourceStringsEN);
×
UNCOV
126
    private _overlaySettings: OverlaySettings = {};
×
UNCOV
127
    private defaultSelectValues = [5, 10, 15, 25, 50, 100, 500];
×
128

129
    /** @hidden @internal */
130
    @HostBinding('class.igx-paginator')
UNCOV
131
    public cssClass = 'igx-paginator';
×
132

133
    /**
134
     * Gets/Sets the current page of the paginator.
135
     * The default is 0.
136
     * ```typescript
137
     * let page = this.paginator.page;
138
     * ```
139
     *
140
     * @memberof IgxPaginatorComponent
141
     */
142
    @Input()
143
    public get page() {
UNCOV
144
        return this._page;
×
145
    }
146

147
    public set page(value: number) {
UNCOV
148
        if (this._page === value || value < 0 || value > this.totalPages) {
×
UNCOV
149
            return;
×
150
        }
UNCOV
151
        const cancelEventArgs: IPageCancellableEventArgs = { current: this._page, next: value, cancel: false };
×
UNCOV
152
        const eventArgs: IPageEventArgs = { previous: this._page, current: value };
×
153

UNCOV
154
        this.paging.emit(cancelEventArgs);
×
UNCOV
155
        if (cancelEventArgs.cancel) {
×
UNCOV
156
            return;
×
157
        }
UNCOV
158
        this._page = value;
×
UNCOV
159
        this.pageChange.emit(this._page);
×
160

UNCOV
161
        this.pagingDone.emit(eventArgs);
×
162
    }
163

164
    /**
165
     * Gets/Sets the number of visible items per page in the paginator.
166
     * The default is 15.
167
     * ```typescript
168
     * let itemsPerPage = this.paginator.perPage;
169
     * ```
170
     *
171
     * @memberof IgxPaginatorComponent
172
     */
173
    @Input()
174
    public get perPage() {
UNCOV
175
        return this._perPage;
×
176
    }
177

178
    public set perPage(value: number) {
UNCOV
179
        if (value < 0 || this.perPage === value) {
×
UNCOV
180
            return;
×
181
        }
UNCOV
182
        this._perPage = Number(value);
×
UNCOV
183
        this.perPageChange.emit(this._perPage);
×
UNCOV
184
        this._selectOptions = this.sortUniqueOptions(this.defaultSelectValues, this._perPage);
×
UNCOV
185
        this.totalPages = Math.ceil(this.totalRecords / this._perPage);
×
UNCOV
186
        if (this.totalPages !== 0 && this.page >= this.totalPages) {
×
UNCOV
187
            this.page = this.totalPages - 1;
×
188
        }
189
    }
190

191
    /**
192
     * Sets the total records.
193
     * ```typescript
194
     * let totalRecords = this.paginator.totalRecords;
195
     * ```
196
     *
197
     * @memberof IgxPaginatorComponent
198
     */
199
    @Input()
200
    public get totalRecords() {
UNCOV
201
        return this._totalRecords;
×
202
    }
203

204
    public set totalRecords(value: number) {
UNCOV
205
        this._totalRecords = value;
×
UNCOV
206
        this.totalPages = Math.ceil(this.totalRecords / this.perPage);
×
UNCOV
207
        if (this.page > this.totalPages) {
×
UNCOV
208
            this.page = 0;
×
209
        }
UNCOV
210
        this.cdr.detectChanges();
×
211
    }
212

213
    /**
214
     * Sets custom options in the select of the paginator
215
     * ```typescript
216
     * let options = this.paginator.selectOptions;
217
     * ```
218
     *
219
     * @memberof IgxPaginatorComponent
220
     */
221
    @Input()
222
    public get selectOptions() {
UNCOV
223
        return this._selectOptions;
×
224
    }
225

226
    public set selectOptions(value: Array<number>) {
UNCOV
227
        this._selectOptions = this.sortUniqueOptions(value, this._perPage);
×
UNCOV
228
        this.defaultSelectValues = [...value];
×
229
    }
230

231
    /**
232
     * Sets custom OverlaySettings.
233
     * ```html
234
     * <igx-paginator [overlaySettings] = "customOverlaySettings"></igx-paginator>
235
     * ```
236
     */
237
    @Input()
238
    public get overlaySettings(): OverlaySettings {
UNCOV
239
        return this._overlaySettings;
×
240
    }
241

242
    public set overlaySettings(value: OverlaySettings) {
UNCOV
243
        this._overlaySettings = Object.assign({}, this._overlaySettings, value);
×
244
    }
245

246
    /* mustSetInCodePlatforms: WebComponents;Blazor;React */
247
    /**
248
     * An accessor that sets the resource strings.
249
     * By default it uses EN resources.
250
     */
251
    @Input()
252
    public set resourceStrings(value: IPaginatorResourceStrings) {
253
        this._resourceStrings = Object.assign({}, this._resourceStrings, value);
×
254
    }
255

256
    /**
257
     * An accessor that returns the resource strings.
258
     */
259
    public get resourceStrings(): IPaginatorResourceStrings {
UNCOV
260
        return this._resourceStrings;
×
261
    }
262

UNCOV
263
    constructor(private elementRef: ElementRef, private cdr: ChangeDetectorRef) { }
×
264

265
    /**
266
     * Returns if the current page is the last page.
267
     * ```typescript
268
     * const lastPage = this.paginator.isLastPage;
269
     * ```
270
     */
271
    public get isLastPage(): boolean {
UNCOV
272
        return this.page + 1 >= this.totalPages;
×
273
    }
274

275
    /**
276
     * Returns if the current page is the first page.
277
     * ```typescript
278
     * const lastPage = this.paginator.isFirstPage;
279
     * ```
280
     */
281
    public get isFirstPage(): boolean {
UNCOV
282
        return this.page === 0;
×
283
    }
284

285

286
    /**
287
     * Returns if the first pager buttons should be disabled
288
     * @hidden
289
     * @deprecated in version 18.1.0. Use the `isFirstPage` property instead.
290
     */
291
    public get isFirstPageDisabled(): boolean {
292
        return this.isFirstPage;
×
293
    }
294

295
    /**
296
     * Returns if the last pager buttons should be disabled
297
     * @hidden
298
     * @deprecated in version 18.1.0. Use the `isLastPage` property instead.
299
     */
300
    public get isLastPageDisabled(): boolean {
301
        return this.isLastPage;
×
302
    }
303

304
    public get nativeElement() {
UNCOV
305
        return this.elementRef.nativeElement;
×
306
    }
307

308
    /**
309
     * Goes to the next page of the `IgxPaginatorComponent`, if the paginator is not already at the last page.
310
     * ```typescript
311
     * this.paginator.nextPage();
312
     * ```
313
     *
314
     * @memberof IgxPaginatorComponent
315
     */
316
    public nextPage(): void {
UNCOV
317
        if (!this.isLastPage) {
×
UNCOV
318
            this.page += 1;
×
319
        }
320
    }
321
    /**
322
     * Goes to the previous page of the `IgxPaginatorComponent`, if the paginator is not already at the first page.
323
     * ```typescript
324
     * this.paginator.previousPage();
325
     * ```
326
     *
327
     * @memberof IgxPaginatorComponent
328
     */
329
    public previousPage(): void {
UNCOV
330
        if (!this.isFirstPage) {
×
UNCOV
331
            this.page -= 1;
×
332
        }
333
    }
334
    /**
335
     * Goes to the desired page index.
336
     * ```typescript
337
     * this.paginator.paginate(1);
338
     * ```
339
     *
340
     * @param val
341
     * @memberof IgxPaginatorComponent
342
     */
343
    public paginate(val: number): void {
UNCOV
344
        if (val < 0 || val > this.totalPages - 1) {
×
UNCOV
345
            return;
×
346
        }
UNCOV
347
        this.page = val;
×
348
    }
349

350
    private sortUniqueOptions(values: Array<number>, newOption: number): number[] {
UNCOV
351
        return Array.from(new Set([...values, newOption])).sort((a, b) => a - b);
×
352
    }
353
}
354

355

356
@Component({
357
    selector: 'igx-page-size',
358
    templateUrl: 'page-size-selector.component.html',
359
    imports: [IgxSelectComponent, FormsModule, IgxSelectItemComponent]
360
})
361
export class IgxPageSizeSelectorComponent {
3✔
362
    /**
363
     * @internal
364
     * @hidden
365
     */
366
    @HostBinding('class.igx-page-size')
UNCOV
367
    public cssClass = 'igx-page-size';
×
368

UNCOV
369
    constructor(@Host() public paginator: IgxPaginatorComponent) { }
×
370
}
371

372

373
@Component({
374
    selector: 'igx-page-nav',
375
    templateUrl: 'pager.component.html',
376
    imports: [IgxRippleDirective, IgxIconComponent, IgxIconButtonDirective]
377
})
378
export class IgxPageNavigationComponent {
3✔
379
    /**
380
     * @internal
381
     * @hidden
382
     */
383
    @HostBinding('class.igx-page-nav')
UNCOV
384
    public cssClass = 'igx-page-nav';
×
385

386
    /**
387
     * Sets the `role` attribute of the element.
388
     */
389
    @HostBinding('attr.role')
390
    @Input()
UNCOV
391
    public role = 'navigation';
×
392

393
    constructor(
394
        @Host()
UNCOV
395
        public paginator: IgxPaginatorComponent) { }
×
396
}
STATUS · Troubleshooting · Open an Issue · Sales · Support · CAREERS · ENTERPRISE · START FREE · SCHEDULE DEMO
ANNOUNCEMENTS · TWITTER · TOS & SLA · Supported CI Services · What's a CI service? · Automated Testing

© 2026 Coveralls, Inc