奥莉莉亚: 在路由的流程步骤中,我如何将一个变量绑定到该路由器?

7

我希望能够将在AuthorizeStep期间找到的用户传递给App类,然后再传递给home模块

以下是我的实现:

export class App {
    configureRouter(config, router) {
        config.addPipelineStep('authorize', AuthorizeStep); 
        config.map([
            {route: ['', ':filter'], name: "", moduleId: 'welcome'}
            {route: 'home', name: "home", moduleId: 'home' auth:true}
        ]);
        this.router = router;
    }
}

class AuthorizeStep {
    run(routingContext, next) {
        if (routingContext.nextInstructions.some(i => i.config.auth)) {
            this.client.get('auth/login')
                .then(response => {
                    this.user = response.content;
                });
        }
        return next();
    }
}
2个回答

7

我在我的应用程序中创建了一个名为AuthContext的类,其中包含一个currentUser属性。您可以将其注入到AuthorizeStep的构造函数中,然后再将其注入到任何其他需要它的模型中。类似于...

import {AuthContext} from './auth-context';

export class App {
    static inject() { return [AuthContext];}

    constructor(authcontext){
        this.authContext = authcontext;
    }

    configureRouter(config, router) {
         config.addPipelineStep('authorize', AuthorizeStep); 
         config.map([
            {route: ['', ':filter'], name: "", moduleId: 'welcome'}
            {route: 'home', name: "home", moduleId: 'home' auth:true}
        ]);
        this.router = router;
    }
}

class AuthorizeStep {
    static inject() { return [AuthContext];}

    constructor(authcontext){
        this.authContext = authcontext;
    }
    run(routingContext, next) {
        if (routingContext.nextInstructions.some(i => i.config.auth)) {
            this.client.get('auth/login')
                .then(response => {
                    this.authcontext.user = response.content;
                });
        }
        return next();
    }
}

你能将这个连接到子路由器吗?我得到了错误:管道步骤只能添加到根路由器。 - smiggleworth
2
Aurelia有两个路由器类,AppRouter和Router。 AppRouter扩展了Router类,是主要的应用程序路由器。 Router用于任何子路由器,包括嵌套的子路由器。 两者之间的主要区别之一是管道仅允许在AppRouter上,而不允许在任何子路由器上。 - Technetium

6

我之前也做过类似的事情,但我发现不能指望 authcontext 在连接其他 viewmodels 时被填充。通过返回由get返回的promise并在get解析期间返回next()来解决这个问题,这样做的想法是不要在解决此步骤之前继续下一个流水线步骤。将其应用于 @JamesCarters 的答案,得到以下未经测试的代码:

class AuthorizeStep {
    static inject() { return [AuthContext];}

    constructor(authcontext){
        this.authContext = authcontext;
    }
    run(routingContext, next) {
        if (routingContext.nextInstructions.some(i => i.config.auth)) {
            return this.client.get('auth/login')
                .then(response => {
                    this.authcontext.user = response.content;
                    return next();
                });
        }
        else {
            return next();
        }
    }
}

1
虽然被接受的答案确实回答了问题,但我认为这是大多数人应该做的。如果您有一个依赖于授权的指令,当然要确保在导航到该指令之前您的授权已经完成! - Technetium

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接