MOBILE-2431 tabs: Fix core-tab not shown if async
parent
3521070090
commit
f8f6d08318
|
@ -47,7 +47,19 @@ export class CoreTabComponent implements OnInit, OnDestroy {
|
||||||
@Input() badge?: string; // A badge to add in the tab.
|
@Input() badge?: string; // A badge to add in the tab.
|
||||||
@Input() badgeStyle?: string; // The badge color.
|
@Input() badgeStyle?: string; // The badge color.
|
||||||
@Input() enabled = true; // Whether the tab is enabled.
|
@Input() enabled = true; // Whether the tab is enabled.
|
||||||
@Input() show = true; // Whether the tab should be shown.
|
@Input() set show(val: boolean) { // Whether the tab should be shown. Use a setter to detect changes on the value.
|
||||||
|
if (typeof val != 'undefined') {
|
||||||
|
const hasChanged = this._show != val;
|
||||||
|
this._show = val;
|
||||||
|
|
||||||
|
if (this.initialized && hasChanged) {
|
||||||
|
this.tabs.tabVisibilityChanged();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
get show(): boolean { // Getter to be able to access "_show" just using .show.
|
||||||
|
return this._show;
|
||||||
|
}
|
||||||
@Input() id?: string; // An ID to identify the tab.
|
@Input() id?: string; // An ID to identify the tab.
|
||||||
@Output() ionSelect: EventEmitter<CoreTabComponent> = new EventEmitter<CoreTabComponent>();
|
@Output() ionSelect: EventEmitter<CoreTabComponent> = new EventEmitter<CoreTabComponent>();
|
||||||
|
|
||||||
|
@ -56,6 +68,8 @@ export class CoreTabComponent implements OnInit, OnDestroy {
|
||||||
|
|
||||||
element: HTMLElement; // The core-tab element.
|
element: HTMLElement; // The core-tab element.
|
||||||
loaded = false;
|
loaded = false;
|
||||||
|
initialized = false;
|
||||||
|
_show = true;
|
||||||
|
|
||||||
constructor(protected tabs: CoreTabsComponent, element: ElementRef, protected domUtils: CoreDomUtilsProvider) {
|
constructor(protected tabs: CoreTabsComponent, element: ElementRef, protected domUtils: CoreDomUtilsProvider) {
|
||||||
this.element = element.nativeElement;
|
this.element = element.nativeElement;
|
||||||
|
@ -66,6 +80,7 @@ export class CoreTabComponent implements OnInit, OnDestroy {
|
||||||
*/
|
*/
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
this.tabs.addTab(this);
|
this.tabs.addTab(this);
|
||||||
|
this.initialized = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
@ -237,10 +237,13 @@ export class CoreTabsComponent implements OnInit, AfterViewInit, OnChanges {
|
||||||
}, 0);
|
}, 0);
|
||||||
|
|
||||||
this.slidesShown = Math.min(this.maxSlides, this.numTabsShown);
|
this.slidesShown = Math.min(this.maxSlides, this.numTabsShown);
|
||||||
this.slides.update();
|
|
||||||
this.slides.resize();
|
|
||||||
|
|
||||||
this.slideChanged();
|
this.slideChanged();
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
this.slides.update();
|
||||||
|
this.slides.resize();
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
protected calculateMaxSlides(): void {
|
protected calculateMaxSlides(): void {
|
||||||
|
@ -357,4 +360,11 @@ export class CoreTabsComponent implements OnInit, AfterViewInit, OnChanges {
|
||||||
this.tabs = newTabs;
|
this.tabs = newTabs;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function to call when the visibility of a tab has changed.
|
||||||
|
*/
|
||||||
|
tabVisibilityChanged(): void {
|
||||||
|
this.updateSlides();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue