ng-zorro-antd-mobile
Version:
An enterprise-class mobile UI components based on Ant Design and Angular
115 lines (110 loc) • 6.42 kB
JavaScript
import * as i0 from '@angular/core';
import { forwardRef, Component, ViewEncapsulation, Input, NgModule } from '@angular/core';
import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
import { PickerComponent, PickerModule } from 'ng-zorro-antd-mobile/picker';
import { LocaleProviderModule } from 'ng-zorro-antd-mobile/locale-provider';
class PickerViewComponent extends PickerComponent {
constructor() {
super(...arguments);
this.data = [];
this.cols = 3;
this.indicatorStyle = {};
this.itemStyle = {};
}
pickerViewInit() {
this.options.data = this.data;
this.options.cols = this.cols;
this.options.cascade = this.cascade;
this.init();
}
init() {
this.selectedTarget = [];
if (this.dataForRender.length === 0 && this.generateArrayData(this.options.data).length > 0) {
this.dataForRender.push(this.generateArrayData(this.options.data));
}
if (this.options.value.length > 0) {
this.getInitValueIndex(this.dataForRender);
}
else {
for (let index = 0; index < this.dataForRender.length; index++) {
this.selectedTarget.push({ targetId: `${index}`, currentY: 0 });
}
}
setTimeout(() => {
this.reloadPicker();
});
}
writeValue(value) {
if (value) {
this.options.value = value;
this.init();
}
}
registerOnChange(fn) {
this.onChange = fn;
}
registerOnTouched(fn) { }
ngOnInit() {
this.pickerViewInit();
}
ngOnChanges(changes) {
if (changes.cols) {
this.dataForRender = [];
}
if (changes.data || changes.cols) {
this.pickerViewInit();
}
}
ngAfterViewInit() {
this.currentPicker = this.elementRef.nativeElement;
this.reloadPicker();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: PickerViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: PickerViewComponent, selector: "PickerView, nzm-picker-view", inputs: { data: "data", cols: "cols", cascade: "cascade", indicatorStyle: "indicatorStyle", itemStyle: "itemStyle" }, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => PickerViewComponent),
multi: true
}
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #picker class=\"am-picker\" style=\"flex-direction: row; align-items: center;\">\n <div *ngFor=\"let item of dataForRender; let i = index\" class=\"am-picker-col\">\n <div #indicator class=\"am-picker-col-indicator \" [ngStyle]=\"indicatorStyle\"></div>\n <div id=\"{{ i }}\" class=\"am-picker-col-mask\" style=\"background-size: 100% 102px;\"></div>\n <div class=\"am-picker-col-content\">\n <div *ngFor=\"let val of item; let i = index\" id=\"{{ i }}\" class=\"am-picker-col-item\" [ngStyle]=\"itemStyle\">\n {{ val.label ? val.label : val }}\n </div>\n </div>\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: PickerViewComponent, decorators: [{
type: Component,
args: [{ selector: 'PickerView, nzm-picker-view', encapsulation: ViewEncapsulation.None, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => PickerViewComponent),
multi: true
}
], template: "<div #picker class=\"am-picker\" style=\"flex-direction: row; align-items: center;\">\n <div *ngFor=\"let item of dataForRender; let i = index\" class=\"am-picker-col\">\n <div #indicator class=\"am-picker-col-indicator \" [ngStyle]=\"indicatorStyle\"></div>\n <div id=\"{{ i }}\" class=\"am-picker-col-mask\" style=\"background-size: 100% 102px;\"></div>\n <div class=\"am-picker-col-content\">\n <div *ngFor=\"let val of item; let i = index\" id=\"{{ i }}\" class=\"am-picker-col-item\" [ngStyle]=\"itemStyle\">\n {{ val.label ? val.label : val }}\n </div>\n </div>\n </div>\n</div>\n" }]
}], propDecorators: { data: [{
type: Input
}], cols: [{
type: Input
}], cascade: [{
type: Input
}], indicatorStyle: [{
type: Input
}], itemStyle: [{
type: Input
}] } });
class PickerViewModule {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: PickerViewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: PickerViewModule, declarations: [PickerViewComponent], imports: [FormsModule, CommonModule, PickerModule, LocaleProviderModule], exports: [PickerViewComponent] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: PickerViewModule, imports: [FormsModule, CommonModule, PickerModule, LocaleProviderModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: PickerViewModule, decorators: [{
type: NgModule,
args: [{
imports: [FormsModule, CommonModule, PickerModule, LocaleProviderModule],
exports: [PickerViewComponent],
declarations: [PickerViewComponent]
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { PickerViewComponent, PickerViewModule };
//# sourceMappingURL=ng-zorro-antd-mobile-picker-view.mjs.map