Typescript 在NativeScript应用程序中保存用户令牌的最佳方法

我想为我的{N}-App中的用户建立一个登录系统。成功登录后，我会收到执行请求所需的令牌。目前，我通过

应用程序设置

模块存储此信息。现在，当用户登录时，我希望UI在“登录屏幕”和“个人信息”屏幕之间切换。用户在未登录时可以使用应用程序的某些功能，因此登录只是侧边栏上的一个选项卡

因此，从我的角度来看，要么路由必须更改为另一个组件（并且我必须在应用程序打开时检查），要么我可以根据是否保存用户令牌来更改组件覆盖。有可能这样做吗？（我必须在.ts文件中的组件注释中定义某些内容，因此最简单的方法是操作这个注释）

我在路由中定义了一次选项卡的名称，在路由目录中也定义了一次选项卡的名称，所以我想我还是要修改路由

我的想法是：

//router definition
path: "Main", component: MainPage, children: [
    (appSettings.getBoolean("isLoggedIn") == true) ?
        {path:  "Login", component: LoginPage} : 
        {path: "My Account", component: LoginPage}
    ]

这（当然）不起作用。还有其他方法吗

编辑：

---

我可能没有很好地描述我的问题：我有一个带有侧栏的应用程序。侧边栏上有一个“登录”标签。每当用户想要登录时，只需点击它并输入他的凭证即可。当用户登录时，我希望这个“登录”标签消失，而是做一些类似“帐户”的事情，在那里他可以看到他的个人信息。他没有访问应用程序新页面的任何权限。因此，我只想更改侧栏条目和特定页面的覆盖。

我们使用angular的

auth guard

实现了类似的功能。 你可以找到一个很好的答案

基本上，您可以使用以下内容配置auth guard：

@Injectable()

export class AuthGuard implements CanActivate {

    auth: any = {};

    constructor(private authService: AuthService, private router: Router) {

    }

    canActivate() {
        if (/*user is logged in*/) {
            this.router.navigate(['/dashboard']);
            return true;
        }
        else {
            this.router.navigate(['/login']);
        }
        return false;
    }
}

<Button text="{{ isLoggedin ? 'login' : 'personal info' }}" [nsRouterLink]="[isLoggedin? '/login' : '/personalinfo' ]"></Button>

在路由器配置中，您可以按如下方式使用它：

const routes: Routes = [
    { path: '', redirectTo: '/login', pathMatch: 'full' },
    { path: AppKeys.Paths.login, loadChildren: () => require(AppKeys.Paths.loginModule)['LoginModule'], canLoad: [AuthGuard]}
];

编辑后

如果我正确理解了你的问题，你需要做一些简单得多的事情。 基本上，您可以使用

routerLink

指令和listview项中的一些条件文本。。。大概是这样的：

@Injectable()

export class AuthGuard implements CanActivate {

    auth: any = {};

    constructor(private authService: AuthService, private router: Router) {

    }

    canActivate() {
        if (/*user is logged in*/) {
            this.router.navigate(['/dashboard']);
            return true;
        }
        else {
            this.router.navigate(['/login']);
        }
        return false;
    }
}

<Button text="{{ isLoggedin ? 'login' : 'personal info' }}" [nsRouterLink]="[isLoggedin? '/login' : '/personalinfo' ]"></Button>

在组件中，您将有一个

isLoggedin

变量，该变量使用

应用程序设置中存储的任何值进行初始化

我还没有测试代码，您需要对其进行调整（不是按钮，而是listview项、路径等），但这是它背后的基本思想：）
我们使用angular的
auth guard实现了类似的功能。
你可以找到一个很好的答案

基本上，您可以使用以下内容配置auth guard：

@Injectable()

export class AuthGuard implements CanActivate {

    auth: any = {};

    constructor(private authService: AuthService, private router: Router) {

    }

    canActivate() {
        if (/*user is logged in*/) {
            this.router.navigate(['/dashboard']);
            return true;
        }
        else {
            this.router.navigate(['/login']);
        }
        return false;
    }
}

<Button text="{{ isLoggedin ? 'login' : 'personal info' }}" [nsRouterLink]="[isLoggedin? '/login' : '/personalinfo' ]"></Button>

在路由器配置中，您可以按如下方式使用它：

const routes: Routes = [
    { path: '', redirectTo: '/login', pathMatch: 'full' },
    { path: AppKeys.Paths.login, loadChildren: () => require(AppKeys.Paths.loginModule)['LoginModule'], canLoad: [AuthGuard]}
];

编辑后

如果我正确理解了你的问题，你需要做一些简单得多的事情。
基本上，您可以使用
routerLink
指令和listview项中的一些条件文本。。。大概是这样的：

@Injectable()

export class AuthGuard implements CanActivate {

    auth: any = {};

    constructor(private authService: AuthService, private router: Router) {

    }

    canActivate() {
        if (/*user is logged in*/) {
            this.router.navigate(['/dashboard']);
            return true;
        }
        else {
            this.router.navigate(['/login']);
        }
        return false;
    }
}

<Button text="{{ isLoggedin ? 'login' : 'personal info' }}" [nsRouterLink]="[isLoggedin? '/login' : '/personalinfo' ]"></Button>



在组件中，您将有一个
isLoggedin
变量，该变量使用
应用程序设置中存储的任何值进行初始化

我还没有测试代码，您需要对其进行调整（不是按钮，而是listview项、路径等），但这是它背后的基本思想：）
谢谢，我会看一看：）我不太理解该模块是如何工作的。它说它用于启用某些路由（如果我理解正确的话），您可以使用它，例如，用于具有特定权限的用户。这意味着它也作为“登录”/“注销”模块工作，对吗？我看到你可以做一些事情，如重定向等，但我没有发现我是否可以简单地隐藏我的登录页面，并给他“联系”页面（如我在文章中的编辑所述）。你能帮我澄清一下吗？谢谢你，我会看一看：）我真的不明白那个模块是如何工作的。它说它用于启用某些路由（如果我理解正确的话），您可以使用它，例如，用于具有特定权限的用户。这意味着它也作为“登录”/“注销”模块工作，对吗？我看到你可以做一些事情，如重定向等，但我没有发现我是否可以简单地隐藏我的登录页面，并给他“联系”页面（如我在文章中的编辑所述）。你能帮我澄清一下吗？