javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-19 19:57:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(angular): URL based tabs

Browse Source
This commit is contained in:
Manu Mtz.-Almeida
2018-04-02 21:20:59 +02:00
parent 5878ad9587
commit 14fedb9a44
3 changed files with 19 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
angular/src/directives/navigation/ion-router-outlet.ts
View File

@ -23,7 +23,7 @@ export class IonRouterOutlet implements OnDestroy, OnInit {
private parentContexts: ChildrenOutletContexts,
private location: ViewContainerRef,
private resolver: ComponentFactoryResolver,
elementRef: ElementRef,
private elementRef: ElementRef,
@Attribute('name') name: string,
@Optional() @Attribute('stack') stack: any,
private changeDetector: ChangeDetectorRef,
@ -142,6 +142,8 @@ export class IonRouterOutlet implements OnDestroy, OnInit {
const direction = this.navCtrl.consumeDirection();
await this.stackCtrl.setActive(enteringView, direction);
this.activateEvents.emit(this.activated.instance);
emitEvent(this.elementRef.nativeElement);
}
canGoBack(deep = 1) {
@ -153,6 +155,15 @@ export class IonRouterOutlet implements OnDestroy, OnInit {
}
}
function emitEvent(el: HTMLElement) {
console.log('ionRouterOutletActivated');
const event = new CustomEvent('ionRouterOutletActivated', {
bubbles: true,
cancelable: true,
});
el.dispatchEvent(event);
}
class OutletInjector implements Injector {
constructor(
private route: ActivatedRoute,

2
angular/src/directives/navigation/tab-delegate.ts
View File

@ -16,7 +16,7 @@ export class TabDelegate {
elementRef.nativeElement.delegate = angularDelegate.create(cfr, injector);
}
@HostListener('ionNavDidChange')
@HostListener('ionRouterOutletActivated', ['$event'])
async onNavChanged() {
const tab = this.elementRef.nativeElement as HTMLIonTabElement;
await tab.componentOnReady();

12
core/src/components/router-outlet/route-outlet.tsx
View File

@ -48,9 +48,6 @@ export class RouterOutlet implements NavOutlet {
}
this.activeComponent = component;
// emit nav will change event
this.ionNavWillChange.emit();
// attach entering view to DOM
const enteringEl = await attachComponent(this.delegate, this.el, component, ['ion-page', 'hide-page'], params);
const leavingEl = this.activeEl;
@ -62,9 +59,6 @@ export class RouterOutlet implements NavOutlet {
this.activeEl = enteringEl;
detachComponent(this.delegate, leavingEl);
// emit nav changed event
this.ionNavDidChange.emit();
return true;
}
@ -76,6 +70,9 @@ export class RouterOutlet implements NavOutlet {
}
this.isTransitioning = true;
// emit nav will change event
this.ionNavWillChange.emit();
opts = opts || {};
await transition({
@ -91,6 +88,9 @@ export class RouterOutlet implements NavOutlet {
baseEl: this.el,
});
this.isTransitioning = false;
// emit nav changed event
this.ionNavDidChange.emit();
return true;
}