1

我想使用 NativeScript-Angular 实现一个简单的应用程序行为,即通常使用导航栏路由到主屏幕,并在特定屏幕内(例如使用 ListView)路由到使用 Page-Router- 的详细信息屏幕插座,所以我可以有后退按钮行为的历史。

例如,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 }
    ]
  }
];

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

4

0 回答 0