有人将如何在 Angular-Nativescript 的选项卡导航中实现模态导航？答案

【问题标题】：How would someone implement Modal navigation inside a tab navigation in Angular-Nativescript?有人将如何在 Angular-Nativescript 的选项卡导航中实现模态导航？
【发布时间】：2019-04-02 09:38:48
【问题描述】：

我一直在努力在Tab Navigation 和Nativescript 中实现Modal Navigation。所以我想知道是否有人对如何实现我正在寻找的东西有很好的实践。

我尝试了多种方法，但都没有奏效，我可能缺乏对router navigation 的深入了解，因为大多数错误都与navigation 有关。

这是一个playground，它试图复制我想要实现的目标：https://play.nativescript.org/?template=play-ng&id=VdmiR9&v=8

经常发生的错误有：

CONSOLE ERROR [native code]: ERROR Error: No componentRef found in DetachedRouteHandle
ERROR Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[FirstModalComponent -> ModalDialogParams]

（虽然ModalDialogService 被注入到AppModule 中）

No component factory found for RootModalComponent. Did you add it to @NgModule.entryComponents

（虽然RootModalComponent被添加到了延迟加载模块的entryComponents中，所以我将它添加到了AppModule中）

Can't resolve '~/app' in...

（这个错误很奇怪，因为在某些项目中，模块的延迟加载与此导入'~/app'一起工作，而在其他项目中则失败）

Error: Cannot match any routes. URL Segment: 'tabs/default'

（一直出现这个错误，看来我没有完全掌握路由的实现方式）

如果有人知道在tab navigation 中做modal navigation 的方法，那将对我有很大帮助。

【问题讨论】：

您确定您共享了正确的 Playground 示例吗？我在链接的代码中没有找到任何模块或选项卡视图。
@Manoj 抱歉，这确实是错误的游乐场，在这里找到好的：play.nativescript.org/?template=play-ng&id=VdmiR9&v=8
我认为只有在 TabViewItem 中使用插座（框架）并从那里启动模式对话框时，这是 {N} Angular 的问题。您可以尝试在 TabView 中使用简单的组件而不是 outlet，这至少可以让这不再是一个障碍。
@Manoj 你有一个带有简单组件的 TabView 的例子吗？谢谢
请参考docs。

标签： tabs angular-ui-router modal-dialog nativescript angular2-nativescript

【解决方案1】：

目前，tabview 中的模态导航在Nativescript Angular 框架中有些错误，但有一种解决方法。你可以在这个 Playground 示例中找到这个 modal navigation 的完整实现：https://play.nativescript.org/?template=play-ng&id=TkK7sQ&v=5

想了解更多信息，请查看我在他们的 GitHub 存储库中创建的这个问题：https://github.com/NativeScript/nativescript-angular/issues/1774

【讨论】：