ng-zorro-antd-mobile
Version:
An enterprise-class mobile UI components based on Ant Design and Angular
104 lines (99 loc) • 8.97 kB
JavaScript
import * as i0 from '@angular/core';
import { EventEmitter, TemplateRef, Component, ViewEncapsulation, Input, Output, NgModule } from '@angular/core';
import * as i2 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i3 from 'ng-zorro-antd-mobile/button';
import { ButtonModule } from 'ng-zorro-antd-mobile/button';
import * as i4 from 'ng-zorro-antd-mobile/flex';
import { FlexModule } from 'ng-zorro-antd-mobile/flex';
import { IconModule } from 'ng-zorro-antd-mobile/icon';
import { takeUntil } from 'rxjs/operators';
import { Subject } from 'rxjs';
import * as i1 from 'ng-zorro-antd-mobile/locale-provider';
import { LocaleProviderModule } from 'ng-zorro-antd-mobile/locale-provider';
class PaginationComponent {
get locale() {
return this._locale;
}
set locale(v) {
this._locale = v;
this.hasSetLocale = true;
this._unsubscribe$.next();
this._unsubscribe$.complete();
}
constructor(_localeProviderService) {
this._localeProviderService = _localeProviderService;
this.prefixCls = 'am-pagination';
this.hasSetLocale = false;
this._locale = {
prevText: '',
nextText: ''
};
this._unsubscribe$ = new Subject();
this.mode = 'button';
this.current = 1;
this.total = 0;
this.simple = false;
this.disabled = false;
this.onChange = new EventEmitter();
}
isTemplateRef(key) {
return key instanceof TemplateRef;
}
onClick(p) {
this.current = p;
this.onChange.emit(p);
}
getNumber(p) {
return new Array(p);
}
ngOnInit() {
this._localeProviderService.localeChange.pipe(takeUntil(this._unsubscribe$)).subscribe(_ => {
if (!this.hasSetLocale) {
this._locale = this._localeProviderService.getLocaleSubObj('Pagination');
}
});
}
ngOnDestroy() {
this._unsubscribe$.next();
this._unsubscribe$.complete();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: PaginationComponent, deps: [{ token: i1.LocaleProviderService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: PaginationComponent, selector: "Pagination, nzm-pagination", inputs: { mode: "mode", current: "current", total: "total", simple: "simple", disabled: "disabled", locale: "locale" }, outputs: { onChange: "onChange" }, ngImport: i0, template: "<div class=\"{{ prefixCls }} {{ prefixCls }}-align-center\">\n <Flex *ngIf=\"mode === 'button'\">\n <FlexItem class=\"{{ prefixCls }}-wrap-btn {{ prefixCls }}-wrap-btn-prev\">\n <a Button [inline]=\"true\" [disabled]=\"current <= 1 || disabled\" (onClick)=\"onClick(current - 1)\">\n <ng-container *ngIf=\"!isTemplateRef(locale.prevText)\">\n {{ locale.prevText }}\n </ng-container>\n <ng-template *ngIf=\"isTemplateRef(locale.prevText)\" [ngTemplateOutlet]=\"locale.prevText\"></ng-template>\n </a>\n </FlexItem>\n <FlexItem class=\"{{ prefixCls }}-wrap\" aria-live=\"assertive\" *ngIf=\"!simple\">\n <span class=\"active\">{{ current }}</span\n >/\n <span>{{ total }}</span>\n </FlexItem>\n <FlexItem class=\"{{ prefixCls }}-wrap-btn {{ prefixCls }}-wrap-btn-next\">\n <a Button [inline]=\"true\" [disabled]=\"current >= total || disabled\" (onClick)=\"onClick(current + 1)\">\n <ng-container *ngIf=\"!isTemplateRef(locale.nextText)\">\n {{ locale.nextText }}\n </ng-container>\n <ng-template *ngIf=\"isTemplateRef(locale.nextText)\" [ngTemplateOutlet]=\"locale.nextText\"></ng-template>\n </a>\n </FlexItem>\n </Flex>\n\n <div class=\"{{ prefixCls }}-wrap\" *ngIf=\"mode === 'number'\">\n <span class=\"active\">{{ current }}</span\n >/<span>{{ total }}</span>\n </div>\n\n <div class=\"{{ prefixCls }}-wrap\" *ngIf=\"mode === 'pointer'\">\n <div\n *ngFor=\"let number of getNumber(total); let i = index\"\n class=\"{{ prefixCls }}-wrap-dot {{ current === i + 1 ? prefixCls + '-wrap-dot-active' : '' }}\"\n >\n <span></span>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.ButtonComponent, selector: "[Button], nzm-button", inputs: ["type", "size", "disabled", "loading", "inline", "icon", "className"], outputs: ["onClick"] }, { kind: "component", type: i4.FlexComponent, selector: "Flex, nzm-flex", inputs: ["direction", "wrap", "justify", "align", "alignContent"] }, { kind: "component", type: i4.FlexItemComponent, selector: "FlexItem, nzm-flex-item" }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: PaginationComponent, decorators: [{
type: Component,
args: [{ selector: 'Pagination, nzm-pagination', encapsulation: ViewEncapsulation.None, template: "<div class=\"{{ prefixCls }} {{ prefixCls }}-align-center\">\n <Flex *ngIf=\"mode === 'button'\">\n <FlexItem class=\"{{ prefixCls }}-wrap-btn {{ prefixCls }}-wrap-btn-prev\">\n <a Button [inline]=\"true\" [disabled]=\"current <= 1 || disabled\" (onClick)=\"onClick(current - 1)\">\n <ng-container *ngIf=\"!isTemplateRef(locale.prevText)\">\n {{ locale.prevText }}\n </ng-container>\n <ng-template *ngIf=\"isTemplateRef(locale.prevText)\" [ngTemplateOutlet]=\"locale.prevText\"></ng-template>\n </a>\n </FlexItem>\n <FlexItem class=\"{{ prefixCls }}-wrap\" aria-live=\"assertive\" *ngIf=\"!simple\">\n <span class=\"active\">{{ current }}</span\n >/\n <span>{{ total }}</span>\n </FlexItem>\n <FlexItem class=\"{{ prefixCls }}-wrap-btn {{ prefixCls }}-wrap-btn-next\">\n <a Button [inline]=\"true\" [disabled]=\"current >= total || disabled\" (onClick)=\"onClick(current + 1)\">\n <ng-container *ngIf=\"!isTemplateRef(locale.nextText)\">\n {{ locale.nextText }}\n </ng-container>\n <ng-template *ngIf=\"isTemplateRef(locale.nextText)\" [ngTemplateOutlet]=\"locale.nextText\"></ng-template>\n </a>\n </FlexItem>\n </Flex>\n\n <div class=\"{{ prefixCls }}-wrap\" *ngIf=\"mode === 'number'\">\n <span class=\"active\">{{ current }}</span\n >/<span>{{ total }}</span>\n </div>\n\n <div class=\"{{ prefixCls }}-wrap\" *ngIf=\"mode === 'pointer'\">\n <div\n *ngFor=\"let number of getNumber(total); let i = index\"\n class=\"{{ prefixCls }}-wrap-dot {{ current === i + 1 ? prefixCls + '-wrap-dot-active' : '' }}\"\n >\n <span></span>\n </div>\n </div>\n</div>\n" }]
}], ctorParameters: () => [{ type: i1.LocaleProviderService }], propDecorators: { mode: [{
type: Input
}], current: [{
type: Input
}], total: [{
type: Input
}], simple: [{
type: Input
}], disabled: [{
type: Input
}], locale: [{
type: Input
}], onChange: [{
type: Output
}] } });
class PaginationModule {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: PaginationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: PaginationModule, declarations: [PaginationComponent], imports: [CommonModule, ButtonModule, FlexModule, IconModule, LocaleProviderModule], exports: [PaginationComponent] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: PaginationModule, imports: [CommonModule, ButtonModule, FlexModule, IconModule, LocaleProviderModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: PaginationModule, decorators: [{
type: NgModule,
args: [{
imports: [CommonModule, ButtonModule, FlexModule, IconModule, LocaleProviderModule],
declarations: [PaginationComponent],
exports: [PaginationComponent]
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { PaginationComponent, PaginationModule };
//# sourceMappingURL=ng-zorro-antd-mobile-pagination.mjs.map