CODEWITHSUNDEEP
nativescriptangular2-nativescriptnativescript-angular
Aaron Ullal
Aaron Ullal

Reputation: 5245

Nativescript angular navigate to previous component

I have a ns-angular app that is structured as follows :

in the app.component I have a master page-router-outlet with 2 pages

Routing is configured in the following way : 

const routes: Routes = [
    { path: '', redirectTo: 'start', pathMatch: 'full' },
    { path: 'start', loadChildren: './views/login/start.module#StartModule' },
    { path: 'main', loadChildren: './views/main/main.module#MainModule' }
];

@NgModule({
    imports: [NativeScriptRouterModule.forRoot(routes)],
    exports: [NativeScriptRouterModule]
})
export class AppRoutingModule { }

In the main component I have static action bar and a child router-outlet that navigates between these components. Again routing is defined as : 

const mainRoutes: Routes = [
    {
        path: '', component: MainComponent, children: [
            { path: '', redirectTo: 'main/explore', pathMatch: 'full' },
            { path: 'camera', loadChildren: './camera/camera.module#CameraModule' },
            { path: 'explore', loadChildren: './explore/explore.module#ExploreModule' }
        ]
    }
];

export const MainRouting: ModuleWithProviders = RouterModule.forChild(mainRoutes);

What currently happens is that if I am in the - let's say- explore component ( /main/explore ), I navigate to the the camera component ( /main/camera ) and I press back on my android device, instead of going back to the explore component I go to the start module. I read the documentation on angular navigation, but even with the following code

android.on(AndroidApplication.activityBackPressedEvent, (data: AndroidActivityBackPressedEventData) => {
    this.routerExtensions.back();
});

I am unable to return to the previous component. How would I achieve that?

Upvotes: 0

Views: 764

Answers (1)

Nick Iliev
Nick Iliev

Reputation: 9670

Try to overwrite the default Android behavior for the back pressed event as shown in this StackOverflow answer

Notice the data.cancel is set to true

application.android.on(AndroidApplication.activityBackPressedEvent, (data: AndroidActivityBackPressedEventData) => {

    data.cancel = true; // prevents default back button behavior

});

Upvotes: 1

Related Questions