Question

我希望使用NativeScript-Angular实现一个简单的应用程序行为，通常使用导航栏和特定屏幕（例如ListView）路由到主屏幕，使用Page路由到详细信息屏幕-Router-Outlet，所以我可以使用后退按钮行为的历史记录。

例如，WhatsApp有此行为，您可以访问导航栏中的联系人列表，并通过分页转到对话。我试图在互联网上找到一个样本，但没有成功。有谁知道如何做到这一点？

我的代码到目前为止：

带导航栏的App.component：

<ActionBar android:title="  Loteria Online"  android.icon="res://ic_launcher" android.iconVisibility="always"  >
    <NavigationButton icon="res://ic_arrow_back_black_24dp" (tap)="goBack()"></NavigationButton>
</ActionBar>
<StackLayout>
    <WrapLayout class="menu">
        <Label [text]="home" class="icon" [nsRouterLink]="['/']"></Label>
        <Label [text]="lotteries" class="icon" [nsRouterLink]="['/lotteries']"></Label>
        <Label [text]="user"  class="icon" [nsRouterLink]="['/login']"></Label>
    </WrapLayout>
    <router-outlet></router-outlet>
</StackLayout>

屏幕彩票，带有按钮，可以通过分页行为路由到详情屏幕。

    <StackLayout class="page" >
   <Button text="Lottery Detail" [nsRouterLink]="['lottery-detail/1']" ></Button>
    <page-router-outlet></page-router-outlet>
    </StackLayout>

app.routing.ts

export const routes = [
  {
    path: "lotteries", component: LotteriesComponent, children: [
      { path: "lottery-detail/:id", component: LotteryDetailComponent }
    ]
  }
];

路由工作，但不是分页行为，只是正常的重定向。

NativeScript-Angular中Router-Outlet内的Page-Router-Outlet

0 个答案: