import {
+ AfterViewInit,
+ ChangeDetectionStrategy,
+ ChangeDetectorRef,
Component,
+ ElementRef,
+ HostListener,
Input,
+ QueryList,
TemplateRef,
- ViewChildren,
ViewChild,
- QueryList,
- ChangeDetectionStrategy,
- ElementRef,
- ChangeDetectorRef,
- HostListener
+ ViewChildren
} from '@angular/core'
-import { NgbModal, NgbDropdown } from '@ng-bootstrap/ng-bootstrap'
-import { uniqueId, lowerFirst } from 'lodash-es'
+import { NgbDropdown, NgbModal } from '@ng-bootstrap/ng-bootstrap'
+import { lowerFirst, uniqueId } from 'lodash-es'
import { ScreenService } from './screen.service'
import { take } from 'rxjs/operators'
styleUrls: [ './list-overflow.component.scss' ],
changeDetection: ChangeDetectionStrategy.OnPush
})
-export class ListOverflowComponent<T extends ListOverflowItem> {
+export class ListOverflowComponent<T extends ListOverflowItem> implements AfterViewInit {
+ @Input() items: T[]
+ @Input() itemTemplate: TemplateRef<{item: T}>
+
@ViewChild('modal', { static: true }) modal: ElementRef
@ViewChild('itemsParent', { static: true }) parent: ElementRef<HTMLDivElement>
@ViewChildren('itemsRendered') itemsRendered: QueryList<ElementRef>
- @Input() items: T[]
- @Input() itemTemplate: TemplateRef<{item: T}>
showItemsUntilIndexExcluded: number
active = false
private screenService: ScreenService
) {}
+ ngAfterViewInit () {
+ setTimeout(() => this.onWindowResize(), 0)
+ }
+
isMenuDisplayed () {
return !!this.showItemsUntilIndexExcluded
}
- @HostListener('window:resize', ['$event'])
+ @HostListener('window:resize')
onWindowResize () {
this.isInTouchScreen = !!this.screenService.isInTouchScreen()
this.isInMobileView = !!this.screenService.isInMobileView()