diff --git a/angular/src/directives/navigation/ion-back-button.ts b/angular/src/directives/navigation/ion-back-button.ts index b10fd6ef240..1ab072056a1 100644 --- a/angular/src/directives/navigation/ion-back-button.ts +++ b/angular/src/directives/navigation/ion-back-button.ts @@ -1,4 +1,4 @@ -import { Directive, ElementRef, HostListener, Optional } from '@angular/core'; +import { Directive, HostListener, Optional } from '@angular/core'; import { NavController } from '../../providers/nav-controller'; @@ -10,19 +10,16 @@ import { IonRouterOutlet } from './ion-router-outlet'; }) export class IonBackButtonDelegate { - set defaultHref(value: string | undefined | null) { - this.elementRef.nativeElement.defaultHref = value; - } - get defaultHref(): string | undefined | null { - return this.elementRef.nativeElement.defaultHref; - } + defaultHref: string | undefined | null; constructor( @Optional() private routerOutlet: IonRouterOutlet, - private navCtrl: NavController, - private elementRef: ElementRef, + private navCtrl: NavController ) {} + /** + * @internal + */ @HostListener('click', ['$event']) onClick(ev: Event) { if (this.routerOutlet && this.routerOutlet.canGoBack()) { diff --git a/angular/src/directives/navigation/ion-tabs.ts b/angular/src/directives/navigation/ion-tabs.ts index 99d3372fcdf..052686b1c72 100644 --- a/angular/src/directives/navigation/ion-tabs.ts +++ b/angular/src/directives/navigation/ion-tabs.ts @@ -49,6 +49,9 @@ export class IonTabs { private navCtrl: NavController, ) {} + /** + * @internal + */ @HostListener('ionRouterOutletActivated', ['$event.detail']) onPageSelected(detail: {view: RouteView}) { if (this.tabBar) { @@ -69,4 +72,8 @@ export class IonTabs { animationDirection: 'back' }); } + + getSelected(): string | undefined { + return this.outlet.getActiveStackId(); + } } diff --git a/angular/src/directives/navigation/router-link-delegate.ts b/angular/src/directives/navigation/router-link-delegate.ts index 632202441d7..b3c73c7bb79 100644 --- a/angular/src/directives/navigation/router-link-delegate.ts +++ b/angular/src/directives/navigation/router-link-delegate.ts @@ -45,6 +45,9 @@ export class RouterLinkDelegate { } } + /** + * @internal + */ @HostListener('click', ['$event']) onClick(ev: UIEvent) { this.navCtrl.setDirection(this.routerDirection); diff --git a/core/api.txt b/core/api.txt index 8ea6fdc9d02..c94d1dbdd70 100644 --- a/core/api.txt +++ b/core/api.txt @@ -1063,7 +1063,7 @@ ion-tab,prop,tab,string,undefined,true,false ion-tab,method,setActive,setActive() => Promise ion-tabs,shadow -ion-tabs,method,getSelected,getSelected() => Promise +ion-tabs,method,getSelected,getSelected() => Promise ion-tabs,method,getTab,getTab(tab: string | HTMLIonTabElement) => Promise ion-tabs,method,select,select(tab: string | HTMLIonTabElement) => Promise ion-tabs,event,ionChange,{tab: HTMLIonTabElement},true diff --git a/core/src/components.d.ts b/core/src/components.d.ts index fe896a52952..d6c10afb9f2 100644 --- a/core/src/components.d.ts +++ b/core/src/components.d.ts @@ -4457,9 +4457,9 @@ export namespace Components { /** * Get the currently selected tab */ - 'getSelected': () => Promise; + 'getSelected': () => Promise; /** - * Get the tab at the given index + * Get the tab element given the tab name */ 'getTab': (tab: string | HTMLIonTabElement) => Promise; /** diff --git a/core/src/components/tab/tab.tsx b/core/src/components/tab/tab.tsx index 81c8015b92a..1d8b7401980 100644 --- a/core/src/components/tab/tab.tsx +++ b/core/src/components/tab/tab.tsx @@ -49,12 +49,16 @@ export class Tab implements ComponentInterface { this.active = true; } - private prepareLazyLoaded(): Promise { + private async prepareLazyLoaded(): Promise { if (!this.loaded && this.component != null) { this.loaded = true; - return attachComponent(this.delegate, this.el, this.component, ['ion-page']); + try { + return attachComponent(this.delegate, this.el, this.component, ['ion-page']); + } catch (e) { + console.error(e); + } } - return Promise.resolve(); + return undefined; } hostData() { diff --git a/core/src/components/tabs/readme.md b/core/src/components/tabs/readme.md index 1e7e6d7cbcd..9043701304b 100644 --- a/core/src/components/tabs/readme.md +++ b/core/src/components/tabs/readme.md @@ -176,19 +176,19 @@ Using tabs with Angular's router is fairly straight forward. Here you only need ## Methods -### `getSelected() => Promise` +### `getSelected() => Promise` Get the currently selected tab #### Returns -Type: `Promise` +Type: `Promise` ### `getTab(tab: string | HTMLIonTabElement) => Promise` -Get the tab at the given index +Get the tab element given the tab name #### Parameters diff --git a/core/src/components/tabs/tabs.tsx b/core/src/components/tabs/tabs.tsx index 122ffd96ee3..269a5970eb0 100644 --- a/core/src/components/tabs/tabs.tsx +++ b/core/src/components/tabs/tabs.tsx @@ -99,6 +99,29 @@ export class Tabs implements NavOutlet { return true; } + /** + * Get the tab element given the tab name + */ + @Method() + async getTab(tab: string | HTMLIonTabElement): Promise { + const tabEl = (typeof tab === 'string') + ? this.tabs.find(t => t.tab === tab) + : tab; + + if (!tabEl) { + console.error(`tab with id: "${tabEl}" does not exist`); + } + return tabEl; + } + + /** + * Get the currently selected tab + */ + @Method() + getSelected(): Promise { + return Promise.resolve(this.selectedTab ? this.selectedTab.tab : undefined); + } + /** @internal */ @Method() async setRouteId(id: string): Promise { @@ -122,27 +145,6 @@ export class Tabs implements NavOutlet { return tabId !== undefined ? { id: tabId, element: this.selectedTab } : undefined; } - /** Get the tab at the given index */ - @Method() - async getTab(tab: string | HTMLIonTabElement): Promise { - const tabEl = (typeof tab === 'string') - ? this.tabs.find(t => t.tab === tab) - : tab; - - if (!tabEl) { - console.error(`tab with id: "${tabEl}" does not exist`); - } - return tabEl; - } - - /** - * Get the currently selected tab - */ - @Method() - getSelected(): Promise { - return Promise.resolve(this.selectedTab); - } - private async initSelect(): Promise { if (this.useRouter) { return;