如何避免在angular2路由中附加到浏览器URL的输入参数？

Question

在路由中，当我们将一些值作为参数从一个组件传递到另一个组件时，传递的参数值会被附加到浏览器URL ...有什么办法可以避免它？

在附加快照的示例中，“Administrator”是我从home.ts组件传递的用户名

我的路由如下

[![export const routes: RouterConfig = \[
    { path: '', component: Login },
    { path: 'login', component: Login },
    { path: 'Home/:userName', component: Home },
    ...HOME_ROUTER_PROVIDERS
    }
\]

export const HOME_ROUTER_PROVIDERS: RouterConfig = \[
    {
        path: 'Home/:userName',
        component: Home,
        children: \[

            { path: 'Dashboard1', component: Dashboard1 },
            { path: 'Dashboard2', component: Dashboard2 },
            ....
    }
\]][1]][1]

我的home.ts我在其中执行navigate.route传递参数

export class Home {
        userName: any;
        constructor(private activatedRoute: ActivatedRoute) {
            console.log("In constructor of Home");
            activatedRoute.params.subscribe(params => {
                this.userName = params['userName']
            });
        }
    }

Answer 1

您可以在登录组件中使用它创建10 - 40，您可以设置一些变量来决定登录用户是否为管理员。

当您的Home组件被路由时，您可以从UserService读取角色值并使用该值执行操作。

希望这会有所帮助!!