router icon indicating copy to clipboard operation
router copied to clipboard

feat: Support loader function as input for route component

Open brandonroberts opened this issue 3 years ago • 3 comments

Loaders can be used to fetch data for the component, run checks such as auth, redirect, and more.

import { Component } from '@angular/core';

@Component({
  template: `
    <router>
      <route path="/lazy"
        [load]="components.lazy"
        [loader]="() => Promise<Response> | Observable<Response>">
      </route>
    </router>
  `,
})
export class MyComponent {
  data$: Observable<Data> = getLoaderData();

  constructor(private loaderData$: LoaderData) {}

  components = {
    lazy: () => import('./lazy/lazy.component')
  };
}

brandonroberts avatar May 31 '22 00:05 brandonroberts

@brandonroberts I am looking to familiarize myself with the inner working of this project, would you mind if I took a crack at this.

mainawycliffe avatar Jul 11 '22 12:07 mainawycliffe

Cool @mainawycliffe. You're welcome to, but I wouldn't put too much effort into it at the moment. I'm still evaluating this vs alternative options for routing

brandonroberts avatar Jul 11 '22 13:07 brandonroberts

@brandonroberts Thanks. That looks interesting, will take a look while I get a chance. If it's what I think it is, I am really looking forward to it.

mainawycliffe avatar Jul 11 '22 13:07 mainawycliffe