eakoriakin / ionic-selectable

Ionic Selectable is an Ionic versatile and highly customizable component that serves as a replacement to Ionic Select, and allows to search items, including async search, create items, customize the layout with templates and much more. It provides an intuitive API and is easy to set up and use.
MIT License
550 stars 123 forks source link

Cannot read properties of undefined (reading 'apply') #443

Open informatica-delagro opened 9 months ago

informatica-delagro commented 9 months ago

HTML

<div class="grupoCampo" (click)="abrirBusquedaMaquina()">
        <label class="labelArriba">Maquina</label>
        <span class="maquina" contenteditable="false" [textContent]="maquinaSeleccionada" (input)="updateInput($event, 'maquinaSeleccionada')"></span>
        <div id="maquinaError">*</div>
</div>

TS

import { IonicSelectableComponent } from '@ionic-selectable/angular'; 

@ViewChild('busquedaMaquinas') busquedaMaquinas!: IonicSelectableComponent;

async abrirBusquedaMaquina(){
    console.log(this.busquedaMaquinas);
    this.busquedaMaquinas.open().then(async () => {
   }
}

Every time a try to open my ionic-selectable thow this error:

core.mjs:11483 ERROR Error: Uncaught (in promise): TypeError: Cannot read properties of undefined (reading 'apply') TypeError: Cannot read properties of undefined (reading 'apply') at ionic-selectable-angular.js:28:71 at _ZoneDelegate.invoke (zone.js:412:30) at Zone.run (zone.js:166:47) at NgZone.runOutsideAngular (core.mjs:10917:28) at Prototype.<computed> [as open] (ionic-selectable-angular.js:28:27) at tarea.page.ts:5929:27 at Generator.next (<anonymous>) at asyncGeneratorStep (asyncToGenerator.js:3:1) at _next (asyncToGenerator.js:22:1) at asyncToGenerator.js:27:1 at resolvePromise (zone.js:1251:35) at zone.js:1158:21 at zone.js:1174:37 at asyncGeneratorStep (asyncToGenerator.js:6:1) at _next (asyncToGenerator.js:22:1) at asyncToGenerator.js:27:1 at ZoneAwarePromise (zone.js:1340:25) at asyncToGenerator.js:19:1 at TareaPage.abrirBusquedaMaquina (tarea.page.ts:5978:8) at TareaPage_ion_content_1_div_22_Template_div_click_1_listener (tarea.page.html:204:40)

this is the line width problems

const proxyMethods = (Cmp, methods) => { const Prototype = Cmp.prototype; methods.forEach(methodName => { Prototype[methodName] = function () { const args = arguments; return this.z.runOutsideAngular(() => this.el[methodName].apply(this.el, args)); }; }); };

and this is de object i got when i made the console.log(this.busquedaMaquinas);

IonicSelectableComponent {elementRef: ElementRef, z: NgZone, viewContainerRef: ViewContainerRef, refMap: WeakMap, el: ionic-selectable, …} blurred : Observable {_subscribe: ƒ} changed : Observable {_subscribe: ƒ} cleared : Observable {_subscribe: ƒ} closed : Observable {_subscribe: ƒ} el : ionic-selectable elementRef : ElementRef {nativeElement: ionic-selectable} focused : Observable {_subscribe: ƒ} infiniteScrolled : Observable {_subscribe: ƒ} ionicSelectableAddItemTemplateDirective : undefined ionicSelectableCloseButtonTemplateDirective : undefined ionicSelectableFooterTemplateDirective : undefined ionicSelectableGroupEndTemplateDirective : undefined ionicSelectableGroupTemplateDirective : undefined ionicSelectableHeaderTemplateDirective : IonicSelectableHeaderTemplateDirective {templateRef: TemplateRef, viewContainer: ViewContainerRef, __ngContext__: 249} ionicSelectableIconTemplateDirective : undefined ionicSelectableItemEndTemplateDirective : undefined ionicSelectableItemIconTemplateDirective : undefined ionicSelectableItemTemplateDirective : IonicSelectableItemTemplateDirective {templateRef: TemplateRef, viewContainer: ViewContainerRef, __ngContext__: 249} ionicSelectableMessageTemplateDirective : undefined ionicSelectablePlaceholderTemplateDirective : undefined ionicSelectableSearchFailTemplateDirective : IonicSelectableSearchFailTemplateDirective {templateRef: TemplateRef, viewContainer: ViewContainerRef, __ngContext__: 249} ionicSelectableTitleTemplateDirective : undefined ionicSelectableValueTemplateDirective : undefined itemAdding : Observable {_subscribe: ƒ} itemsChanged : Observable {_subscribe: ƒ} opened : Observable {_subscribe: ƒ} refMap : WeakMap {} searchFailed : Observable {_subscribe: ƒ} searchSuccessed : Observable {_subscribe: ƒ} searching : Observable {_subscribe: ƒ} selected : Observable {_subscribe: ƒ} viewContainerRef : ViewContainerRef {_lContainer: Array(11), _hostTNode: {…}, _hostLView: Array(1789)} z : NgZone {hasPendingMacrotasks: true, hasPendingMicrotasks: false, isStable: true, onUnstable: EventEmitter_, onMicrotaskEmpty: EventEmitter_, …} __ngContext__ : 249 addButtonText : (...) canAddItem : (...) canClear : (...) canSearch : (...) clearButtonText : (...) closeButtonSlot : (...) closeButtonText : (...) confirmButtonText : (...) disabledItems : (...) groupColor : (...) groupTextField : (...) groupValueField : (...) hasConfirmButton : (...) hasInfiniteScroll : (...) hasSearchText : (...) hasVirtualScroll : (...) headerColor : (...) infiniteScrollThreshold : (...) isConfirmButtonEnabled : (...) isDisabled : (...) isMultiple : (...) isOpened : (...) itemIconSlot : (...) itemTextField : (...) itemValueField : (...) items : (...) modalCssClass : (...) modalEnterAnimation : (...) modalLeaveAnimation : (...) name : (...) placeholder : (...) searchCancelButtonIcon : (...) searchCancelButtonText : (...) searchClearIcon : (...) searchDebounce : (...) searchIcon : (...) searchInputmode : (...) searchPlaceholder : (...) searchShowCancelButton : (...) searchText : (...) selectedText : (...) shouldBackdropClose : (...) shouldDelegateSearchToEvent : (...) shouldFocusSearchbar : (...) shouldStoreItemValue : (...) titleText : (...) value : (...) virtualScrollApproxHeaderHeight : (...) virtualScrollApproxItemHeight : (...) virtualScrollHeaderFn : (...) [[Prototype]] : Object

I'm using Ionic 7 but still using modules