1

I'm currently working on a portfolio. My intention is to only change the route ("portfolio" and its child route "all" which is displayed immediately) as soon as the images on that specific route are fully loaded. When the route was clicked as progress bar from Angular Materials shall be displayed.

Since I'm a beginner with angular I unfortunately can't provide any code, but my app-routing.module.

Browsing the internet I found a similar question, which I didn't really understand:

https://forum.vuejs.org/t/load-images-before-changing-route/11479



App-Routing.Module:

const routes: Routes = [
  { path: '', component: HomeComponent },
  { path: 'about', component:  AboutComponent},
  { path: 'portfolio', component:  PortfolioComponent, children: [
      { path: '', redirectTo: 'all', pathMatch: 'full'},
      { path: 'all', component: AllComponent},
      { path: 'wedding', component: PortfolioweddingComponent},
      { path: 'adventure', component: PortfolioadventureComponent},
    ]},
  { path: 'book-me', component:  BookMeComponent},
  { path: 'book-me/wedding', component:  WeddingComponent},
  { path: 'book-me/adventuresession', component: AdventuresessionComponent},
];

@NgModule({
  imports: [RouterModule.forRoot(routes, {scrollPositionRestoration: 'enabled'}), RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }
  • Tells us if images are loaded from the assets folder within the app or hosted in some other domain ? – Joel Joseph Mar 29 '19 at 13:54
  • @JoelJoseph They are loaded from the assets folder. –  Mar 29 '19 at 13:58
  • dup of https://stackoverflow.com/questions/280049/how-to-create-a-javascript-callback-for-knowing-when-an-image-is-loaded? – ABOS Mar 29 '19 at 15:32

0 Answers0