Using Resolve to stop a route change

Question

I have an angular2 app which lists a number of items, which the user can click to get more details about the item.

Now, some of these items I don't actually have details for - which I'll know when I make the service request, and so instead of loading a page with a 404 or whatever, I would like to simply not let him route to that page.

I'm using a Resolve to load the item, so in theory it should be pretty simple, but I can't figure out how to stop the route from changing under certain conditions.

I tried to use Location.back but that didn't seem to work at all.

resolve(route: ActivatedRouteSnapshot): Promise<Article> {
    return this.articleService.getArticle(route.paramMap.get('name')).then((article) => {

        if (article) {
            return Promise.resolve(article);
        }
        else {
            //Stop them?
        }

    })
}

score 3 · Accepted Answer · answered May 15 '17 at 17:47

3

It is

    if (article) {
        return article;
    }
    else {
        return Promise.reject('No articles');
        // or throw ...
    }

No Promise.resolve is necessary.

answered May 15 '17 at 17:47

Estus Flask

206,104
70
425
565

Thank you—this seems to be the only solution that works for Angular 6. – Alex Peters Sep 11 '18 at 09:47
@AlexPeters You're welcome. You can also use async..await. – Estus Flask Sep 11 '18 at 11:27

score 0 · Answer 2 · answered Sep 19 '19 at 12:31

0

Another way to prevent navigation is to throw an error from the resolve stream. See https://stackoverflow.com/a/58010984/3936587

answered Sep 19 '19 at 12:31

Rene Juuse

575
8
16

Using Resolve to stop a route change

2 Answers2