ng-zorro-antd-mobile
Version:
An enterprise-class mobile UI components based on Ant Design and Angular
60 lines • 7.55 kB
JavaScript
import { Component, Input, ViewEncapsulation, HostBinding } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class DotIndicatorComponent {
constructor() {
this.items = [];
this._page = 0;
this._pageCount = 0;
this.dotStyle = {};
this.dotActiveStyle = {};
this.dotColor = 'white';
this.dotIndicator = true;
}
set page(p) {
this._page = p;
this.updateSelected();
}
set pageCount(p) {
this._pageCount = p || 0;
this.updateItems();
}
updateItems() {
this.items = new Array(this._pageCount);
for (let i = 0; i < this._pageCount; i++) {
this.items[i] = { active: i == this._page };
}
}
updateSelected() {
if (this.items.length != this._pageCount) {
return this.updateItems();
}
if (this.items.length == 0) {
return;
}
for (let i = 0; i < this._pageCount; i++) {
this.items[i].active = false;
}
this.items[this._page].active = true;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DotIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: DotIndicatorComponent, selector: "DotIndicator, nzm-dot-indicator", inputs: { page: "page", pageCount: "pageCount", dotStyle: "dotStyle", dotActiveStyle: "dotActiveStyle", dotColor: "dotColor" }, host: { properties: { "class.dot-indicator": "this.dotIndicator" } }, ngImport: i0, template: "<div class=\"am-carousel-wrap\">\n <div *ngFor=\"let item of items\" class=\"am-carousel-wrap-dot\" [class.am-carousel-wrap-dot-active]=\"item.active\">\n <span [ngStyle]=\"item.active ? dotActiveStyle : dotStyle\"></span>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DotIndicatorComponent, decorators: [{
type: Component,
args: [{ selector: 'DotIndicator, nzm-dot-indicator', encapsulation: ViewEncapsulation.None, template: "<div class=\"am-carousel-wrap\">\n <div *ngFor=\"let item of items\" class=\"am-carousel-wrap-dot\" [class.am-carousel-wrap-dot-active]=\"item.active\">\n <span [ngStyle]=\"item.active ? dotActiveStyle : dotStyle\"></span>\n </div>\n</div>\n" }]
}], propDecorators: { page: [{
type: Input
}], pageCount: [{
type: Input
}], dotStyle: [{
type: Input
}], dotActiveStyle: [{
type: Input
}], dotColor: [{
type: Input
}], dotIndicator: [{
type: HostBinding,
args: ['class.dot-indicator']
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZG90aW5kaWNhdG9yLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvY2Fyb3VzZWwvZG90aW5kaWNhdG9yL2RvdGluZGljYXRvci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9jb21wb25lbnRzL2Nhcm91c2VsL2RvdGluZGljYXRvci9kb3RpbmRpY2F0b3IuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsaUJBQWlCLEVBQUUsV0FBVyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFPakYsTUFBTSxPQUFPLHFCQUFxQjtJQUxsQztRQU1FLFVBQUssR0FBMEIsRUFBRSxDQUFDO1FBRTFCLFVBQUssR0FBRyxDQUFDLENBQUM7UUFDVixlQUFVLEdBQUcsQ0FBQyxDQUFDO1FBYXZCLGFBQVEsR0FBVyxFQUFFLENBQUM7UUFFdEIsbUJBQWMsR0FBVyxFQUFFLENBQUM7UUFFNUIsYUFBUSxHQUFHLE9BQU8sQ0FBQztRQUduQixpQkFBWSxHQUFZLElBQUksQ0FBQztLQXFCOUI7SUF2Q0MsSUFDSSxJQUFJLENBQUMsQ0FBUztRQUNoQixJQUFJLENBQUMsS0FBSyxHQUFHLENBQUMsQ0FBQztRQUNmLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztJQUN4QixDQUFDO0lBQ0QsSUFDSSxTQUFTLENBQUMsQ0FBUztRQUNyQixJQUFJLENBQUMsVUFBVSxHQUFHLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDekIsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO0lBQ3JCLENBQUM7SUFXTyxXQUFXO1FBQ2pCLElBQUksQ0FBQyxLQUFLLEdBQUcsSUFBSSxLQUFLLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDO1FBQ3hDLEtBQUssSUFBSSxDQUFDLEdBQUcsQ0FBQyxFQUFFLENBQUMsR0FBRyxJQUFJLENBQUMsVUFBVSxFQUFFLENBQUMsRUFBRSxFQUFFO1lBQ3hDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLEdBQUcsRUFBRSxNQUFNLEVBQUUsQ0FBQyxJQUFJLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztTQUM3QztJQUNILENBQUM7SUFFTyxjQUFjO1FBQ3BCLElBQUksSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLElBQUksSUFBSSxDQUFDLFVBQVUsRUFBRTtZQUN4QyxPQUFPLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQztTQUMzQjtRQUNELElBQUksSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLElBQUksQ0FBQyxFQUFFO1lBQzFCLE9BQU87U0FDUjtRQUNELEtBQUssSUFBSSxDQUFDLEdBQUcsQ0FBQyxFQUFFLENBQUMsR0FBRyxJQUFJLENBQUMsVUFBVSxFQUFFLENBQUMsRUFBRSxFQUFFO1lBQ3hDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUMsTUFBTSxHQUFHLEtBQUssQ0FBQztTQUM5QjtRQUNELElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDLE1BQU0sR0FBRyxJQUFJLENBQUM7SUFDdkMsQ0FBQzs4R0E1Q1UscUJBQXFCO2tHQUFyQixxQkFBcUIsNlFDUGxDLHdQQUtBOzsyRkRFYSxxQkFBcUI7a0JBTGpDLFNBQVM7K0JBQ0UsaUNBQWlDLGlCQUU1QixpQkFBaUIsQ0FBQyxJQUFJOzhCQVNqQyxJQUFJO3NCQURQLEtBQUs7Z0JBTUYsU0FBUztzQkFEWixLQUFLO2dCQU1OLFFBQVE7c0JBRFAsS0FBSztnQkFHTixjQUFjO3NCQURiLEtBQUs7Z0JBR04sUUFBUTtzQkFEUCxLQUFLO2dCQUlOLFlBQVk7c0JBRFgsV0FBVzt1QkFBQyxxQkFBcUIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBWaWV3RW5jYXBzdWxhdGlvbiwgSG9zdEJpbmRpbmcgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnRG90SW5kaWNhdG9yLCBuem0tZG90LWluZGljYXRvcicsXG4gIHRlbXBsYXRlVXJsOiAnLi9kb3RpbmRpY2F0b3IuY29tcG9uZW50Lmh0bWwnLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lXG59KVxuZXhwb3J0IGNsYXNzIERvdEluZGljYXRvckNvbXBvbmVudCB7XG4gIGl0ZW1zOiB7IGFjdGl2ZTogYm9vbGVhbiB9W10gPSBbXTtcblxuICBwcml2YXRlIF9wYWdlID0gMDtcbiAgcHJpdmF0ZSBfcGFnZUNvdW50ID0gMDtcblxuICBASW5wdXQoKVxuICBzZXQgcGFnZShwOiBudW1iZXIpIHtcbiAgICB0aGlzLl9wYWdlID0gcDtcbiAgICB0aGlzLnVwZGF0ZVNlbGVjdGVkKCk7XG4gIH1cbiAgQElucHV0KClcbiAgc2V0IHBhZ2VDb3VudChwOiBudW1iZXIpIHtcbiAgICB0aGlzLl9wYWdlQ291bnQgPSBwIHx8IDA7XG4gICAgdGhpcy51cGRhdGVJdGVtcygpO1xuICB9XG4gIEBJbnB1dCgpXG4gIGRvdFN0eWxlOiBvYmplY3QgPSB7fTtcbiAgQElucHV0KClcbiAgZG90QWN0aXZlU3R5bGU6IG9iamVjdCA9IHt9O1xuICBASW5wdXQoKVxuICBkb3RDb2xvciA9ICd3aGl0ZSc7XG5cbiAgQEhvc3RCaW5kaW5nKCdjbGFzcy5kb3QtaW5kaWNhdG9yJylcbiAgZG90SW5kaWNhdG9yOiBib29sZWFuID0gdHJ1ZTtcblxuICBwcml2YXRlIHVwZGF0ZUl0ZW1zKCkge1xuICAgIHRoaXMuaXRlbXMgPSBuZXcgQXJyYXkodGhpcy5fcGFnZUNvdW50KTtcbiAgICBmb3IgKGxldCBpID0gMDsgaSA8IHRoaXMuX3BhZ2VDb3VudDsgaSsrKSB7XG4gICAgICB0aGlzLml0ZW1zW2ldID0geyBhY3RpdmU6IGkgPT0gdGhpcy5fcGFnZSB9O1xuICAgIH1cbiAgfVxuXG4gIHByaXZhdGUgdXBkYXRlU2VsZWN0ZWQoKSB7XG4gICAgaWYgKHRoaXMuaXRlbXMubGVuZ3RoICE9IHRoaXMuX3BhZ2VDb3VudCkge1xuICAgICAgcmV0dXJuIHRoaXMudXBkYXRlSXRlbXMoKTtcbiAgICB9XG4gICAgaWYgKHRoaXMuaXRlbXMubGVuZ3RoID09IDApIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG4gICAgZm9yIChsZXQgaSA9IDA7IGkgPCB0aGlzLl9wYWdlQ291bnQ7IGkrKykge1xuICAgICAgdGhpcy5pdGVtc1tpXS5hY3RpdmUgPSBmYWxzZTtcbiAgICB9XG4gICAgdGhpcy5pdGVtc1t0aGlzLl9wYWdlXS5hY3RpdmUgPSB0cnVlO1xuICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwiYW0tY2Fyb3VzZWwtd3JhcFwiPlxuICA8ZGl2ICpuZ0Zvcj1cImxldCBpdGVtIG9mIGl0ZW1zXCIgY2xhc3M9XCJhbS1jYXJvdXNlbC13cmFwLWRvdFwiIFtjbGFzcy5hbS1jYXJvdXNlbC13cmFwLWRvdC1hY3RpdmVdPVwiaXRlbS5hY3RpdmVcIj5cbiAgICA8c3BhbiBbbmdTdHlsZV09XCJpdGVtLmFjdGl2ZSA/IGRvdEFjdGl2ZVN0eWxlIDogZG90U3R5bGVcIj48L3NwYW4+XG4gIDwvZGl2PlxuPC9kaXY+XG4iXX0=