Nativescript：页面出口路由器不工作答案

【问题标题】：Nativescript: Page outlet router not workingNativescript：页面出口路由器不工作
【发布时间】：2019-09-22 18:16:34
【问题描述】：

我正在构建一个 tabview 和 page-outlet-router 或 router-outlet 在控制台或应用模拟器中没有显示任何内容，也没有错误，甚至调试 chrome

我正在使用最新的一切 angular/tns/tns-core (nativescript 6 / angular 8)

代码：

标签模板

<TabView androidTabsPosition="bottom">
    <page-router-outlet *tabItem="{title: 'Players Tab'}" name="homeTab">
    </page-router-outlet>
 </TabView>

标签路由：

const routes: Routes = [
  {
    path: 'tabs',
    component: TabsComponent,
    children: [
      { path: '', redirectTo: '/(homeTab:home)', pathMatch: 'full' },
      { path: 'home', outlet: 'homeTab', loadChildren: '~/app/pages/home/home.module#HomeModule', component: NSEmptyOutletComponent },
    ]
  },
  {
    path: '',
    redirectTo: '/tabs/(homeTab:home)',
    pathMatch: 'full'
  }
]

@NgModule({
  declarations: [TabsComponent],
  imports: [
    NativeScriptCommonModule,
    NativeScriptRouterModule.forChild(routes)
  ],
  schemas: [NO_ERRORS_SCHEMA],
  exports: [NativeScriptRouterModule]
})

家乡路由：

const routes: Routes = [
  {
    path: '',
    component: HomeComponent
  }
];

@NgModule({
  imports: [NativeScriptRouterModule.forChild(routes)],
  exports: [NativeScriptRouterModule]
})

首页模板

<StackLayout>
    <Button text="home works!" class="btn btn-primary"></Button>
</StackLayout>

【问题讨论】：

请参阅tns-template-tab-navigation-ng 模板以获得干净的示例，如果您仍然发现问题，请分享 Playground 示例。

标签： javascript android angular typescript nativescript

【解决方案1】：

我认为您需要做的是将tabs 组件选择器名称更改为与 URL 路径不同的名称。例如：“标签页”。此外，用于登录页面的任何其他根组件也应具有与相应路由路径不同的选择器。

在此处跟踪问题：https://github.com/NativeScript/nativescript-angular/issues/1967

【讨论】：