@duoduo-oba/ng-devui
Version:
DevUI components based on Angular
1,198 lines (1,190 loc) • 45.3 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/forms'), require('rxjs'), require('rxjs/operators'), require('ng-devui/position'), require('ng-devui/utils'), require('@angular/common'), require('ng-devui/window-ref'), require('ng-devui/loading')) :
typeof define === 'function' && define.amd ? define('ng-devui/auto-complete', ['exports', '@angular/core', '@angular/forms', 'rxjs', 'rxjs/operators', 'ng-devui/position', 'ng-devui/utils', '@angular/common', 'ng-devui/window-ref', 'ng-devui/loading'], factory) :
(global = global || self, factory((global['ng-devui'] = global['ng-devui'] || {}, global['ng-devui']['auto-complete'] = {}), global.ng.core, global.ng.forms, global.rxjs, global.rxjs.operators, global['ng-devui'].position, global['ng-devui'].utils, global.ng.common, global['ng-devui']['window-ref'], global['ng-devui'].loading));
}(this, (function (exports, core, forms, rxjs, operators, position, utils, common, windowRef, loading) { 'use strict';
/**
* @fileoverview added by tsickle
* Generated from: highlight.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var HighlightComponent = /** @class */ (function () {
function HighlightComponent() {
this.display = 'inline';
}
Object.defineProperty(HighlightComponent.prototype, "htmlContent", {
get: /**
* @return {?}
*/
function () { return this.highlightHtml; },
enumerable: true,
configurable: true
});
/**
* @param {?} changes
* @return {?}
*/
HighlightComponent.prototype.ngOnChanges = /**
* @param {?} changes
* @return {?}
*/
function (changes) {
this.highlightHtml = this.transform(this.value, this.term);
};
/**
* @param {?} value
* @param {?} term
* @return {?}
*/
HighlightComponent.prototype.transform = /**
* @param {?} value
* @param {?} term
* @return {?}
*/
function (value, term) {
return value && term ? this.highlight(value, term) : value;
};
/**
* @param {?} value
* @param {?} term
* @return {?}
*/
HighlightComponent.prototype.highlight = /**
* @param {?} value
* @param {?} term
* @return {?}
*/
function (value, term) {
/** @type {?} */
var regExp = new RegExp(term.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&'), 'gi');
return value.replace(regExp, (/**
* @param {?} match
* @return {?}
*/
function (match) {
return "<b class=\"re-highlight\">" + match + "</b>";
}));
};
HighlightComponent.decorators = [
{ type: core.Component, args: [{
selector: 'd-highlight',
template: "",
changeDetection: core.ChangeDetectionStrategy.OnPush
}] }
];
HighlightComponent.propDecorators = {
htmlContent: [{ type: core.HostBinding, args: ['innerHTML',] }],
display: [{ type: core.HostBinding, args: ['style.display',] }],
value: [{ type: core.Input }],
term: [{ type: core.Input }]
};
return HighlightComponent;
}());
if (false) {
/** @type {?} */
HighlightComponent.prototype.display;
/** @type {?} */
HighlightComponent.prototype.value;
/** @type {?} */
HighlightComponent.prototype.term;
/** @type {?} */
HighlightComponent.prototype.highlightHtml;
}
/**
* @fileoverview added by tsickle
* Generated from: auto-complete-popup.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var AutoCompletePopupComponent = /** @class */ (function () {
function AutoCompletePopupComponent() {
this.activeIndex = 0;
this.showLoading = false;
this.labelMinHeight = 20; // position.top小于20px时候，表示光标在第一行
// position.top小于20px时候，表示光标在第一行
this.onChange = (/**
* @param {?} _
* @return {?}
*/
function (_) { return null; });
this.onTouched = (/**
* @return {?}
*/
function () { return null; });
this.formatter = (/**
* @param {?} item
* @return {?}
*/
function (item) { return item ? (item.label || item.toString()) : ''; });
this.maxHeight = 300;
}
/**
* @param {?} obj
* @return {?}
*/
AutoCompletePopupComponent.prototype.writeValue = /**
* @param {?} obj
* @return {?}
*/
function (obj) {
this.value = obj;
};
/**
* @param {?} isDisabled
* @return {?}
*/
AutoCompletePopupComponent.prototype.setDisabledState = /**
* @param {?} isDisabled
* @return {?}
*/
function (isDisabled) {
this.disabled = isDisabled;
};
/**
* @param {?} fn
* @return {?}
*/
AutoCompletePopupComponent.prototype.registerOnChange = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onChange = fn;
};
/**
* @param {?} fn
* @return {?}
*/
AutoCompletePopupComponent.prototype.registerOnTouched = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onTouched = fn;
};
/**
* @param {?} event
* @param {?} item
* @return {?}
*/
AutoCompletePopupComponent.prototype.onSelect = /**
* @param {?} event
* @param {?} item
* @return {?}
*/
function (event, item) {
if (this.disabledKey && item[this.disabledKey]) {
event.preventDefault();
event.stopPropagation();
return;
}
if (this.overview === 'single') { // 单选场景和单行场景不需要冒泡
event.preventDefault();
event.stopPropagation();
}
this.value = item;
this.onTouched();
this.onChange({ type: 'select', value: this.value });
};
/**
* @param {?} event
* @return {?}
*/
AutoCompletePopupComponent.prototype.selectCurrentItem = /**
* @param {?} event
* @return {?}
*/
function (event) {
this.onSelect(event, this.source[this.activeIndex]);
};
/**
* @param {?} index
* @return {?}
*/
AutoCompletePopupComponent.prototype.onActiveIndexChange = /**
* @param {?} index
* @return {?}
*/
function (index) {
this.activeIndex = index;
};
/**
* @return {?}
*/
AutoCompletePopupComponent.prototype.reset = /**
* @return {?}
*/
function () {
this.activeIndex = 0;
};
/**
* @return {?}
*/
AutoCompletePopupComponent.prototype.next = /**
* @return {?}
*/
function () {
if (this.isOpen && this.source && this.source.length) {
if (this.activeIndex === this.source.length - 1) {
this.activeIndex = 0;
return;
}
this.activeIndex = this.activeIndex + 1;
}
};
/**
* @return {?}
*/
AutoCompletePopupComponent.prototype.prev = /**
* @return {?}
*/
function () {
if (this.isOpen && this.source && this.source.length) {
if (this.activeIndex === 0) {
this.activeIndex = this.source.length - 1;
return;
}
this.activeIndex = this.activeIndex - 1;
}
};
/**
* @param {?} index
* @param {?} item
* @return {?}
*/
AutoCompletePopupComponent.prototype.trackByFn = /**
* @param {?} index
* @param {?} item
* @return {?}
*/
function (index, item) {
return index;
};
/**
* @param {?} $event
* @return {?}
*/
AutoCompletePopupComponent.prototype.animationEnd = /**
* @param {?} $event
* @return {?}
*/
function ($event) {
if (!this.isOpen) {
/** @type {?} */
var targetElement = this.selectMenuElement.nativeElement;
targetElement.style.display = 'none';
}
};
/**
* @param {?} $event
* @return {?}
*/
AutoCompletePopupComponent.prototype.loadMoreEvent = /**
* @param {?} $event
* @return {?}
*/
function ($event) {
this.showLoading = true;
this.onChange({ type: 'loadMore', value: this });
};
/**
* @param {?} $event
* @return {?}
*/
AutoCompletePopupComponent.prototype.loadFinish = /**
* @param {?} $event
* @return {?}
*/
function ($event) {
this.showLoading = false;
};
AutoCompletePopupComponent.decorators = [
{ type: core.Component, args: [{
selector: 'd-auto-complete-popup',
template: "<div\r\n class=\"devui-dropdown-menu\"\r\n [style.display]=\"isOpen && (source?.length || noResultItemTemplate) ? 'inline-block' : 'none'\"\r\n [style.top]=\"overview === 'multiline' ? (position?.top < labelMinHeight ? '50%' : '100%') : '100%'\"\r\n [style.left]=\"overview === 'multiline' ? position?.left + 'px' : '0'\"\r\n [@fadeInOut]=\"isOpen ? 'bottom' : 'void'\"\r\n (@fadeInOut.done)=\"animationEnd($event)\"\r\n #selectMenuElement\r\n dLoading\r\n [showLoading]=\"showLoading\"\r\n [backdrop]=\"true\"\r\n>\r\n <ul\r\n class=\"devui-list-unstyled scroll-height\"\r\n [style.maxHeight]=\"maxHeight + 'px'\"\r\n dLazyLoad\r\n [enableLazyLoad]=\"enableLazyLoad\"\r\n (loadMore)=\"loadMoreEvent($event)\"\r\n >\r\n <li *ngIf=\"popTipsText && popTipsText.length > 0\" class=\"devui-popup-tips\">\r\n {{ popTipsText }}\r\n </li>\r\n <li\r\n *ngFor=\"let item of source; let $index = index; trackBy: trackByFn\"\r\n class=\"devui-dropdown-item\"\r\n [title]=\"formatter(item)\"\r\n [ngClass]=\"{\r\n 'devui-dropdown-bg': $index == activeIndex,\r\n disabled: disabledKey && item[disabledKey]\r\n }\"\r\n (click)=\"onSelect($event, item)\"\r\n (mouseenter)=\"onActiveIndexChange($index)\"\r\n >\r\n <ng-template\r\n [ngTemplateOutlet]=\"itemTemplate || defaultItemTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n formatter: formatter,\r\n term: term,\r\n source: source,\r\n item: item,\r\n $index: $index\r\n }\"\r\n >\r\n </ng-template>\r\n </li>\r\n <li class=\"devui-dropdown-item devui-no-result-template\" *ngIf=\"!source?.length && noResultItemTemplate != null\">\r\n <ng-template [ngTemplateOutlet]=\"noResultItemTemplate\" [ngTemplateOutletContext]=\"{ term: term, source: source }\"> </ng-template>\r\n </li>\r\n </ul>\r\n</div>\r\n\r\n<ng-template #defaultItemTemplate let-item=\"item\" let-term=\"term\">\r\n <d-highlight [value]=\"formatter(item)\" [term]=\"term\"></d-highlight>\r\n</ng-template>\r\n",
animations: [utils.fadeInOut],
styles: ["@charset \"UTF-8\";.devui-dropdown-menu{width:100%;display:block}.devui-dropdown-item{cursor:pointer;display:block;width:100%;padding:8px 1rem;clear:both;border:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.devui-no-result-template{cursor:not-allowed}.devui-no-result-template:hover{background:0 0!important}.devui-dropdown-item.disabled,.devui-dropdown-item.disabled:hover{cursor:not-allowed;opacity:.3;color:#252b3a;background:#fff}ul.devui-list-unstyled{margin:0;overflow-y:auto}:host(.devui-dropdown-menu){width:100%;margin:0;padding:5px 0}.devui-dropdown-bg{background:#f2f5fc}.devui-popup-tips{color:#adb0b8;padding:3px 1rem}"]
}] }
];
/** @nocollapse */
AutoCompletePopupComponent.ctorParameters = function () { return []; };
AutoCompletePopupComponent.propDecorators = {
cssClass: [{ type: core.Input }],
maxHeight: [{ type: core.Input }],
disabled: [{ type: core.Input }],
disabledKey: [{ type: core.Input }],
source: [{ type: core.Input }],
position: [{ type: core.Input }],
isOpen: [{ type: core.Input }],
term: [{ type: core.Input }],
popTipsText: [{ type: core.Input }],
overview: [{ type: core.Input }],
itemTemplate: [{ type: core.Input }],
noResultItemTemplate: [{ type: core.Input }],
formatter: [{ type: core.Input }],
dropdown: [{ type: core.Input }],
selectWidth: [{ type: core.Input }],
enableLazyLoad: [{ type: core.Input }],
selectMenuElement: [{ type: core.ViewChild, args: ['selectMenuElement', { static: true },] }]
};
return AutoCompletePopupComponent;
}());
if (false) {
/** @type {?} */
AutoCompletePopupComponent.prototype.activeIndex;
/** @type {?} */
AutoCompletePopupComponent.prototype.cssClass;
/** @type {?} */
AutoCompletePopupComponent.prototype.maxHeight;
/** @type {?} */
AutoCompletePopupComponent.prototype.disabled;
/** @type {?} */
AutoCompletePopupComponent.prototype.disabledKey;
/** @type {?} */
AutoCompletePopupComponent.prototype.source;
/** @type {?} */
AutoCompletePopupComponent.prototype.position;
/** @type {?} */
AutoCompletePopupComponent.prototype.isOpen;
/** @type {?} */
AutoCompletePopupComponent.prototype.term;
/** @type {?} */
AutoCompletePopupComponent.prototype.popTipsText;
/** @type {?} */
AutoCompletePopupComponent.prototype.overview;
/** @type {?} */
AutoCompletePopupComponent.prototype.itemTemplate;
/** @type {?} */
AutoCompletePopupComponent.prototype.noResultItemTemplate;
/** @type {?} */
AutoCompletePopupComponent.prototype.formatter;
/** @type {?} */
AutoCompletePopupComponent.prototype.dropdown;
/** @type {?} */
AutoCompletePopupComponent.prototype.selectWidth;
/** @type {?} */
AutoCompletePopupComponent.prototype.enableLazyLoad;
/** @type {?} */
AutoCompletePopupComponent.prototype.selectMenuElement;
/** @type {?} */
AutoCompletePopupComponent.prototype.showLoading;
/**
* @type {?}
* @private
*/
AutoCompletePopupComponent.prototype.value;
/** @type {?} */
AutoCompletePopupComponent.prototype.labelMinHeight;
/**
* @type {?}
* @private
*/
AutoCompletePopupComponent.prototype.onChange;
/**
* @type {?}
* @private
*/
AutoCompletePopupComponent.prototype.onTouched;
}
/**
* @fileoverview added by tsickle
* Generated from: auto-complete.directive.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var AutoCompleteDirective = /** @class */ (function () {
function AutoCompleteDirective(elementRef, viewContainerRef, componentFactoryResolver, renderer, injector, positionService, changeDetectorRef) {
this.elementRef = elementRef;
this.viewContainerRef = viewContainerRef;
this.componentFactoryResolver = componentFactoryResolver;
this.renderer = renderer;
this.injector = injector;
this.positionService = positionService;
this.changeDetectorRef = changeDetectorRef;
this.autocomplete = 'off';
this.autocapitalize = 'off';
this.autocorrect = 'off';
this.sceneType = ''; // sceneType使用场景：select(下拉框) suggest(联想)
// sceneType使用场景：select(下拉框) suggest(联想)
this.tipsText = ''; // 提示文字
this.maxHeight = 300;
/**
* 【可选】启用数据懒加载，默认不启用
*/
this.enableLazyLoad = false;
this.loadMore = new core.EventEmitter();
this.selectValue = new core.EventEmitter();
this.transInputFocusEmit = new core.EventEmitter(); // input状态传给父组件函数
// input状态传给父组件函数
this.KEYBOARD_EVENT_NOT_REFRESH = ['escape', 'enter', 'arrowup', 'arrowdown',
/*ie 10 edge */ 'esc', 'up', 'down'];
this.popTipsText = '';
this.focus = false;
this.placement = 'bottom-left';
this.onChange = (/**
* @param {?} _
* @return {?}
*/
function (_) { return null; });
this.onTouched = (/**
* @return {?}
*/
function () { return null; });
this.delay = 300;
this.valueChanges = this.registerInputEvent(elementRef);
this.minLength = 1;
this.itemTemplate = null;
this.noResultItemTemplate = null;
this.formatter = (/**
* @param {?} item
* @return {?}
*/
function (item) { return item ? (item.label || item.toString()) : ''; });
this.valueParser = (/**
* @param {?} item
* @return {?}
*/
function (item) { return item; });
}
/**
* @return {?}
*/
AutoCompleteDirective.prototype.ngOnInit = /**
* @return {?}
*/
function () {
var _this = this;
// 调用时机：input keyup
this.subscription = this.valueChanges
.subscribe((/**
* @param {?} source
* @return {?}
*/
function (source) { return _this.onSourceChange(source); }));
// 动态的创建了popup组件，
/** @type {?} */
var factory = this.componentFactoryResolver.resolveComponentFactory(AutoCompletePopupComponent);
this.popupRef = this.viewContainerRef.createComponent(factory, this.viewContainerRef.length, this.injector);
this.fillPopup(this.source);
if (!this.searchFn) {
this.searchFn = (/**
* @param {?} term
* @return {?}
*/
function (term) {
return rxjs.of(_this.source.filter((/**
* @param {?} lang
* @return {?}
*/
function (lang) { return _this.formatter(lang).toLowerCase().indexOf(term.toLowerCase()) !== -1; })));
});
}
// 调用时机：选中回车或者鼠标单击下拉选项
this.popupRef.instance.registerOnChange((/**
* @param {?} item
* @return {?}
*/
function (item) {
if (item.type === 'loadMore') {
_this.loadMore.emit(item.value);
return;
}
/** @type {?} */
var value = _this.valueParser(item.value);
_this.writeValue(value);
_this.onChange(value);
_this.hidePopup();
_this.selectValue.emit(item.value);
if (_this.overview && _this.overview !== 'single') {
setTimeout((/**
* @return {?}
*/
function () {
_this.restLatestSource();
}), 0);
}
}));
};
/**
* @param {?} changes
* @return {?}
*/
AutoCompleteDirective.prototype.ngOnChanges = /**
* @param {?} changes
* @return {?}
*/
function (changes) {
if (changes && this.popupRef && changes.source) {
this.fillPopup(this.source);
}
};
/**
* @return {?}
*/
AutoCompleteDirective.prototype.restLatestSource = /**
* @return {?}
*/
function () {
if (this.latestSource && this.latestSource.length > 0) {
this.writeValue('');
this.clearInputValue();
this.showLatestSource();
}
};
// 调用时机：input keyup
// 调用时机：input keyup
/**
* @param {?} source
* @return {?}
*/
AutoCompleteDirective.prototype.onSourceChange =
// 调用时机：input keyup
/**
* @param {?} source
* @return {?}
*/
function (source) {
if (!this.elementRef.nativeElement.value) {
if (this.sceneType !== 'select') { // 下拉场景不展示最近输入
this.showLatestSource();
}
else {
this.showSource(source, true, true);
}
}
else {
this.showSource(source, true, true);
}
};
/**
* @private
* @return {?}
*/
AutoCompleteDirective.prototype.showLatestSource = /**
* @private
* @return {?}
*/
function () {
var _this = this;
/** @type {?} */
var tempSource = [];
if (this.latestSource && this.latestSource.length > 0) {
this.searchFn('').subscribe((/**
* @param {?} source
* @return {?}
*/
function (source) {
/** @type {?} */
var t = _this.latestSource.slice(-5);
tempSource = t.filter((/**
* @param {?} data
* @return {?}
*/
function (data) {
if (!data.label) {
return source.find((/**
* @param {?} item
* @return {?}
*/
function (item) { return item === data; }));
}
else {
return source.find((/**
* @param {?} item
* @return {?}
*/
function (item) { return item.label === data.label; }));
}
}));
/** @type {?} */
var pop = _this.popupRef.instance;
pop.reset();
_this.popTipsText = '最近输入';
_this.fillPopup(tempSource);
pop.isOpen = true;
_this.changeDetectorRef.markForCheck();
}));
}
if (tempSource.length <= 0) {
this.hidePopup();
}
};
/**
* @private
* @param {?} source
* @param {?} setOpen
* @param {?} isReset
* @return {?}
*/
AutoCompleteDirective.prototype.showSource = /**
* @private
* @param {?} source
* @param {?} setOpen
* @param {?} isReset
* @return {?}
*/
function (source, setOpen, isReset) {
if ((source && source.length) || this.noResultItemTemplate) {
/** @type {?} */
var pop = this.popupRef.instance;
if (isReset) {
pop.reset();
}
this.popTipsText = this.tipsText || '';
this.fillPopup(source, this.value);
if (setOpen) {
pop.isOpen = true;
}
this.changeDetectorRef.markForCheck();
}
else {
this.hidePopup();
}
};
/**
* @param {?} obj
* @return {?}
*/
AutoCompleteDirective.prototype.writeValue = /**
* @param {?} obj
* @return {?}
*/
function (obj) {
this.value = this.formatter(obj) || '';
this.writeInputValue(this.value);
};
/**
* @param {?} fn
* @return {?}
*/
AutoCompleteDirective.prototype.registerOnChange = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onChange = fn;
};
/**
* @param {?} fn
* @return {?}
*/
AutoCompleteDirective.prototype.registerOnTouched = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onTouched = fn;
};
/**
* @param {?} isDisabled
* @return {?}
*/
AutoCompleteDirective.prototype.setDisabledState = /**
* @param {?} isDisabled
* @return {?}
*/
function (isDisabled) {
this.disabled = isDisabled;
this.renderer.setProperty(this.elementRef.nativeElement, 'disabled', isDisabled);
if (this.popupRef) {
this.popupRef.instance.setDisabledState(isDisabled);
}
};
/**
* @return {?}
*/
AutoCompleteDirective.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.unSubscription();
};
/**
* @param {?} $event
* @return {?}
*/
AutoCompleteDirective.prototype.onFocus = /**
* @param {?} $event
* @return {?}
*/
function ($event) {
var _this = this;
this.focus = true;
this.transInputFocusEmit.emit({
focus: true,
popupRef: this.popupRef
});
/** @type {?} */
var isOpen = this.sceneType !== 'select';
if (this.sceneType === 'select') {
this.searchFn('').subscribe((/**
* @param {?} source
* @return {?}
*/
function (source) {
_this.showSource(source, isOpen, false);
}));
}
else {
if (!this.elementRef.nativeElement.value) {
this.showLatestSource();
}
else {
this.searchFn(this.elementRef.nativeElement.value).subscribe((/**
* @param {?} source
* @return {?}
*/
function (source) {
_this.showSource(source, true, false);
}));
}
}
};
/**
* @param {?} $event
* @return {?}
*/
AutoCompleteDirective.prototype.onBlur = /**
* @param {?} $event
* @return {?}
*/
function ($event) {
this.focus = false;
this.onTouched();
};
/**
* @param {?} $event
* @return {?}
*/
AutoCompleteDirective.prototype.onEscKeyup = /**
* @param {?} $event
* @return {?}
*/
function ($event) {
this.hidePopup();
};
/**
* @param {?} $event
* @return {?}
*/
AutoCompleteDirective.prototype.onEnterKeyDown = /**
* @param {?} $event
* @return {?}
*/
function ($event) {
if (!this.popupRef.instance.source || !this.popupRef.instance.isOpen) {
return;
}
if (this.popupRef) {
this.popupRef.instance.selectCurrentItem($event);
}
};
/**
* @param {?} $event
* @return {?}
*/
AutoCompleteDirective.prototype.onArrowUpKeyDown = /**
* @param {?} $event
* @return {?}
*/
function ($event) {
if (this.popupRef) {
$event.preventDefault();
$event.stopPropagation();
this.popupRef.instance.prev();
}
};
/**
* @param {?} $event
* @return {?}
*/
AutoCompleteDirective.prototype.onArrowDownKeyDown = /**
* @param {?} $event
* @return {?}
*/
function ($event) {
if (this.popupRef) {
$event.preventDefault();
$event.stopPropagation();
this.popupRef.instance.next();
}
};
/**
* @param {?} $event
* @return {?}
*/
AutoCompleteDirective.prototype.onDocumentClick = /**
* @param {?} $event
* @return {?}
*/
function ($event) {
if (this.focus) {
this.transInputFocusEmit.emit({
focus: this.focus,
popupRef: this.popupRef
});
}
if (this.popupRef && !this.popupRef.instance.isOpen) {
return;
}
/** @type {?} */
var hostElement = this.elementRef.nativeElement;
if (!hostElement.contains($event.target)) {
this.hidePopup();
this.transInputFocusEmit.emit({
focus: false,
popupRef: this.popupRef
});
}
};
/**
* @private
* @return {?}
*/
AutoCompleteDirective.prototype.hidePopup = /**
* @private
* @return {?}
*/
function () {
if (this.popupRef) {
this.popupRef.instance.isOpen = false;
}
};
/**
* @private
* @param {?=} source
* @param {?=} term
* @return {?}
*/
AutoCompleteDirective.prototype.fillPopup = /**
* @private
* @param {?=} source
* @param {?=} term
* @return {?}
*/
function (source, term) {
var _this = this;
this.position = this.positionService.position(this.elementRef.nativeElement);
/** @type {?} */
var pop = this.popupRef.instance;
pop.source = source;
pop.maxHeight = this.maxHeight;
pop.term = term;
pop.disabledKey = this.disabledKey;
pop.enableLazyLoad = this.enableLazyLoad;
['formatter', 'itemTemplate', 'noResultItemTemplate', 'cssClass', 'dropdown', 'popTipsText', 'position', 'overview']
.forEach((/**
* @param {?} key
* @return {?}
*/
function (key) {
if (_this[key] !== undefined) {
pop[key] = _this[key];
}
}));
};
/**
* @private
* @param {?} value
* @return {?}
*/
AutoCompleteDirective.prototype.writeInputValue = /**
* @private
* @param {?} value
* @return {?}
*/
function (value) {
this.renderer.setProperty(this.elementRef.nativeElement, 'value', value);
};
/**
* @private
* @return {?}
*/
AutoCompleteDirective.prototype.clearInputValue = /**
* @private
* @return {?}
*/
function () {
this.renderer.setProperty(this.elementRef.nativeElement, 'value', '');
};
/**
* @private
* @return {?}
*/
AutoCompleteDirective.prototype.unSubscription = /**
* @private
* @return {?}
*/
function () {
if (this.subscription) {
this.subscription.unsubscribe();
this.subscription = null;
}
};
/**
* @param {?} term
* @return {?}
*/
AutoCompleteDirective.prototype.onTermChange = /**
* @param {?} term
* @return {?}
*/
function (term) {
this.value = term;
if (this.popupRef) {
this.popupRef.instance.term = term;
}
this.onChange(term);
};
/**
* @private
* @param {?} elementRef
* @return {?}
*/
AutoCompleteDirective.prototype.registerInputEvent = /**
* @private
* @param {?} elementRef
* @return {?}
*/
function (elementRef) {
var _this = this;
return rxjs.fromEvent(elementRef.nativeElement, 'keyup')
.pipe(operators.filter((/**
* @param {?} e
* @return {?}
*/
function (e) {
return _this.KEYBOARD_EVENT_NOT_REFRESH.indexOf(e.key.toLocaleLowerCase()) === -1;
})), operators.map((/**
* @param {?} e
* @return {?}
*/
function (e) { return e.target.value; })), operators.tap((/**
* @param {?} term
* @return {?}
*/
function (term) { return _this.onTouched(); })), operators.filter((/**
* @param {?} term
* @return {?}
*/
function (term) { return !_this.disabled && _this.searchFn && term.length >= 0; })), operators.debounceTime(this.delay), operators.tap((/**
* @param {?} term
* @return {?}
*/
function (term) { return _this.onTermChange(term); })), operators.switchMap((/**
* @param {?} term
* @return {?}
*/
function (term) { return _this.searchFn(term, _this); })));
};
AutoCompleteDirective.decorators = [
{ type: core.Directive, args: [{
selector: '[dAutoComplete]',
exportAs: 'autoComplete',
providers: [{
provide: forms.NG_VALUE_ACCESSOR,
useExisting: core.forwardRef((/**
* @return {?}
*/
function () { return AutoCompleteDirective; })),
multi: true
}]
},] }
];
/** @nocollapse */
AutoCompleteDirective.ctorParameters = function () { return [
{ type: core.ElementRef },
{ type: core.ViewContainerRef },
{ type: core.ComponentFactoryResolver },
{ type: core.Renderer2 },
{ type: core.Injector },
{ type: position.PositionService },
{ type: core.ChangeDetectorRef }
]; };
AutoCompleteDirective.propDecorators = {
autocomplete: [{ type: core.HostBinding, args: ['attr.autocomplete',] }],
autocapitalize: [{ type: core.HostBinding, args: ['attr.autocapitalize',] }],
autocorrect: [{ type: core.HostBinding, args: ['attr.autocorrect',] }],
disabled: [{ type: core.Input }],
cssClass: [{ type: core.Input }],
delay: [{ type: core.Input }],
minLength: [{ type: core.Input }],
itemTemplate: [{ type: core.Input }],
noResultItemTemplate: [{ type: core.Input }],
formatter: [{ type: core.Input }],
sceneType: [{ type: core.Input }],
tipsText: [{ type: core.Input }],
overview: [{ type: core.Input }],
latestSource: [{ type: core.Input }],
source: [{ type: core.Input }],
valueParser: [{ type: core.Input }],
searchFn: [{ type: core.Input }],
dropdown: [{ type: core.Input }],
maxHeight: [{ type: core.Input }],
disabledKey: [{ type: core.Input }],
enableLazyLoad: [{ type: core.Input }],
loadMore: [{ type: core.Output }],
selectValue: [{ type: core.Output }],
transInputFocusEmit: [{ type: core.Output }],
onFocus: [{ type: core.HostListener, args: ['focus', ['$event'],] }],
onBlur: [{ type: core.HostListener, args: ['blur', ['$event'],] }],
onEscKeyup: [{ type: core.HostListener, args: ['keydown.esc', ['$event'],] }],
onEnterKeyDown: [{ type: core.HostListener, args: ['keydown.Enter', ['$event'],] }],
onArrowUpKeyDown: [{ type: core.HostListener, args: ['keydown.ArrowUp', ['$event'],] }],
onArrowDownKeyDown: [{ type: core.HostListener, args: ['keydown.ArrowDown', ['$event'],] }],
onDocumentClick: [{ type: core.HostListener, args: ['document:click', ['$event'],] }]
};
return AutoCompleteDirective;
}());
if (false) {
/** @type {?} */
AutoCompleteDirective.prototype.autocomplete;
/** @type {?} */
AutoCompleteDirective.prototype.autocapitalize;
/** @type {?} */
AutoCompleteDirective.prototype.autocorrect;
/** @type {?} */
AutoCompleteDirective.prototype.disabled;
/** @type {?} */
AutoCompleteDirective.prototype.cssClass;
/** @type {?} */
AutoCompleteDirective.prototype.delay;
/** @type {?} */
AutoCompleteDirective.prototype.minLength;
/** @type {?} */
AutoCompleteDirective.prototype.itemTemplate;
/** @type {?} */
AutoCompleteDirective.prototype.noResultItemTemplate;
/** @type {?} */
AutoCompleteDirective.prototype.formatter;
/** @type {?} */
AutoCompleteDirective.prototype.sceneType;
/** @type {?} */
AutoCompleteDirective.prototype.tipsText;
/** @type {?} */
AutoCompleteDirective.prototype.overview;
/** @type {?} */
AutoCompleteDirective.prototype.latestSource;
/** @type {?} */
AutoCompleteDirective.prototype.source;
/** @type {?} */
AutoCompleteDirective.prototype.valueParser;
/** @type {?} */
AutoCompleteDirective.prototype.searchFn;
/** @type {?} */
AutoCompleteDirective.prototype.dropdown;
/** @type {?} */
AutoCompleteDirective.prototype.maxHeight;
/** @type {?} */
AutoCompleteDirective.prototype.disabledKey;
/**
* 【可选】启用数据懒加载，默认不启用
* @type {?}
*/
AutoCompleteDirective.prototype.enableLazyLoad;
/** @type {?} */
AutoCompleteDirective.prototype.loadMore;
/** @type {?} */
AutoCompleteDirective.prototype.selectValue;
/** @type {?} */
AutoCompleteDirective.prototype.transInputFocusEmit;
/** @type {?} */
AutoCompleteDirective.prototype.KEYBOARD_EVENT_NOT_REFRESH;
/** @type {?} */
AutoCompleteDirective.prototype.popupRef;
/** @type {?} */
AutoCompleteDirective.prototype.popTipsText;
/** @type {?} */
AutoCompleteDirective.prototype.position;
/** @type {?} */
AutoCompleteDirective.prototype.focus;
/**
* @type {?}
* @private
*/
AutoCompleteDirective.prototype.valueChanges;
/**
* @type {?}
* @private
*/
AutoCompleteDirective.prototype.value;
/**
* @type {?}
* @private
*/
AutoCompleteDirective.prototype.placement;
/**
* @type {?}
* @private
*/
AutoCompleteDirective.prototype.subscription;
/**
* @type {?}
* @private
*/
AutoCompleteDirective.prototype.onChange;
/**
* @type {?}
* @private
*/
AutoCompleteDirective.prototype.onTouched;
/**
* @type {?}
* @private
*/
AutoCompleteDirective.prototype.elementRef;
/**
* @type {?}
* @private
*/
AutoCompleteDirective.prototype.viewContainerRef;
/**
* @type {?}
* @private
*/
AutoCompleteDirective.prototype.componentFactoryResolver;
/**
* @type {?}
* @private
*/
AutoCompleteDirective.prototype.renderer;
/**
* @type {?}
* @private
*/
AutoCompleteDirective.prototype.injector;
/**
* @type {?}
* @private
*/
AutoCompleteDirective.prototype.positionService;
/**
* @type {?}
* @private
*/
AutoCompleteDirective.prototype.changeDetectorRef;
}
/**
* @fileoverview added by tsickle
* Generated from: auto-complete.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var AutoCompleteModule = /** @class */ (function () {
function AutoCompleteModule() {
}
AutoCompleteModule.decorators = [
{ type: core.NgModule, args: [{
imports: [common.CommonModule, forms.FormsModule, utils.LazyLoadModule, loading.LoadingModule],
exports: [AutoCompleteDirective, AutoCompletePopupComponent, HighlightComponent],
declarations: [AutoCompleteDirective, AutoCompletePopupComponent, HighlightComponent],
providers: [windowRef.DocumentRef, windowRef.WindowRef, position.PositionService],
entryComponents: [AutoCompletePopupComponent]
},] }
];
return AutoCompleteModule;
}());
exports.AutoCompleteDirective = AutoCompleteDirective;
exports.AutoCompleteModule = AutoCompleteModule;
exports.AutoCompletePopupComponent = AutoCompletePopupComponent;
exports.HighlightComponent = HighlightComponent;
Object.defineProperty(exports, '__esModule', { value: true });
})));
//# sourceMappingURL=ng-devui-auto-complete.umd.js.map