Angular routerExtensions.navigate在此NativeScript应用程序上运行不正常

我有一个非常基本的

NativeScript/Angular

项目，它基于以下示例代码：

它基本上允许用户使用

Google

登录

在用户介绍其凭据之后，用户将被重定向回应用程序，并且应将其重定向到路由：

/authenticated

我的问题是，在文件login.component.ts上，当调用

此.routerExtensions.navigate（[“/authenticated”]）

方法时，在某些情况下，用户会被转发到该路由，有时不会。我试着调查一下情况，但看起来是随机的

另一方面，我必须说我总是在控制台上登录访问令牌。因此，

authService

工作正常，但导航功能不正常

此外，我不知道是否必须使用：

this.routerExtensions.navigate（[“/authenticated”]）

或

this.routerExtensions.navigate（[“./authenticated”]）

在官方网站的示例代码中有两个点（第二种情况），您可以在这里看到：

但这似乎不是问题所在

我想我在这里做点什么

下面是我的一些代码片段

你知道我该怎么解决这个问题吗

谢谢

app.component.html

<!-- https://docs.nativescript.org/angular/core-concepts/angular-navigation.html#page-router-outlet -->
<page-router-outlet></page-router-outlet>

<ActionBar title="My App" class="action-bar"></ActionBar>

<StackLayout class="form">

    <Button text="Login Social Network" (tap)="onTapLogin()" class="btn btn-primary btn-active"></Button>

</StackLayout>

login.component.html

<!-- https://docs.nativescript.org/angular/core-concepts/angular-navigation.html#page-router-outlet -->
<page-router-outlet></page-router-outlet>

<ActionBar title="My App" class="action-bar"></ActionBar>

<StackLayout class="form">

    <Button text="Login Social Network" (tap)="onTapLogin()" class="btn btn-primary btn-active"></Button>

</StackLayout>

auth.service.ts

import { NgModule } from "@angular/core";
import { NativeScriptRouterModule } from "nativescript-angular/router";
import { Routes } from "@angular/router";

import { LoginComponent } from "./screens/login/login.component";
import { AuthenticatedComponent } from "./screens/authenticated/authenticated.component";
import { ItemsComponent } from "./item/items.component";
import { ItemDetailComponent } from "./item/item-detail.component";

const routes: Routes = [
    { path: "", redirectTo: "/login", pathMatch: "full" },
    { path: "login", component: LoginComponent },
    { path: "authenticated", component: AuthenticatedComponent },
    { path: "items", component: ItemsComponent },
    { path: "item/:id", component: ItemDetailComponent }
];

@NgModule({
    imports: [NativeScriptRouterModule.forRoot(routes)],
    exports: [NativeScriptRouterModule]
})
export class AppRoutingModule { }

import { Component, OnInit } from "@angular/core";
import { RouterExtensions } from "nativescript-angular";
import { ITnsOAuthTokenResult } from "nativescript-oauth2";
import { Page } from "tns-core-modules/ui/page/page";
import { AuthService } from "../../services/auth.service";

@Component({
    templateUrl: "./login.component.html",
    styleUrls: ["./login.component.scss"],
})
export class LoginComponent implements OnInit {

    constructor(private page: Page, private authService: AuthService, private routerExtensions: RouterExtensions) {
    page.actionBarHidden = true;
    }

    ngOnInit(): void {

    }

    public onTapLogin() {
        this.authService
            .tnsOauthLogin("google")
            .then((result: ITnsOAuthTokenResult) => {
                console.log("back to login component with token " + result.accessToken);
                this.routerExtensions
                    .navigate(["/authenticated"])
                    .then(() => console.log("navigated to /authenticated"))
                    .catch(err => console.log("error navigating to /authenticated: " + err));
            })
            .catch(e => console.log("Error: " + e));
    }

}

import { Injectable } from "@angular/core";

import {
  TnsOAuthClient,
  ITnsOAuthTokenResult
} from "nativescript-oauth2";

@Injectable()
export class AuthService {
  private client: TnsOAuthClient = null;

  constructor() { }

  public tnsOauthLogin(providerType): Promise<ITnsOAuthTokenResult> {

    this.client = new TnsOAuthClient(providerType);

    return new Promise<ITnsOAuthTokenResult>((resolve, reject) => {
      this.client.loginWithCompletion(
        (tokenResult: ITnsOAuthTokenResult, error) => {
          if (error) {
            console.error("back to main page with error: ");
            console.error(error);
            reject(error);
          } else {
            console.log("back to main page with access token: ");
            console.log(tokenResult);
            resolve(tokenResult);
          }
        }
      );
    });

  }

  public tnsOauthLogout() {
    if (this.client) {
      this.client.logout();
    }
  }
}

从“@angular/core”导入{Injectable}；
进口{
TnsOAuthClient，
ITnsOAuthTokenResult
}来自“nativescript-oauth2”；
@可注射（）
导出类身份验证服务{
私有客户端：TnsOAuthClient=null；
构造函数（）{}
公共tnsOauthLogin（providerType）：承诺{
this.client=新的TnsOAuthClient（providerType）；
返回新承诺（（解决、拒绝）=>{
this.client.loginWithCompletion(
（tokenResult:ITnsOAuthTokenResult，错误）=>{
如果（错误）{
console.error（“返回主页，出现错误：”）；
控制台错误（error）；
拒绝（错误）；
}否则{
log（“返回带有访问令牌的主页：”；
console.log（tokenResult）；
解决（结果）；
}
}
);
});
}
公共tnsOauthLogout（）{
如果（此.client）{
this.client.logout（）；
}
}
}

在您的情况下，我认为直接导航到经验证的

是正确的

this.routerExtension.navigate('authenticated'], {
    clearHistory: true
});

并在成功登录后清除历史记录

如果您愿意，也可以尝试
this.routerExtension.navigateByUrl（'/authenticated'）

在任何情况下，您都可以在
应用程序路由
模块中快速添加一些有用的跟踪：

NativeScriptRouterModule.forRoot(routes, {
    enableTracing: true
})

最后，有时它有助于在导航前添加超时，例如：

public onTapLogin() {
        this.authService
            .tnsOauthLogin("google")
            .then((result: ITnsOAuthTokenResult) => {
                console.log("back to login component with token " + result.accessToken);
                setTimeout( () => {
                    this.routerExtensions
                        .navigate(["/authenticated"])
                        .then(() => console.log("navigated to /authenticated"))
                        .catch(err => console.log("error navigating to /authenticated: " + err));
                }, 300);
            })
            .catch(e => console.log("Error: " + e));
    }

但这通常只在我使用开放模式导航时才需要

编辑：所以，在谷歌签名后，我尝试了你的示例项目和导航。由于您随机得到一个错误，我想这可能只是一个UI计时问题，所以我上次建议使用
setTimeout
将是一个适当的解决方法。
我在使用Android Emulator时遇到了这个问题，我更新了nativescript并更改了Emulator中使用的设备，它已修复。
因此，请尝试更新并进行一些更改，希望它能正常工作
哪一部分？删除“/”、使用navigateByUrl、使用超时或启用跟踪以获取有关该问题的详细信息？我尝试了所有这些，但均未成功。这里提供了有关该问题的更多详细信息：因此您激活了路由器跟踪，但在控制台中没有获得任何额外信息？只是进行了一次正常检查，你没有使用拦截器来处理你的请求吗？如果您这样做，可能会停止导航操作。您是否解决过此问题？我现在也有同样的问题