在 NativeScript/Angular 应用程序中使用 skipLocationChange 会导致 'skipped location' 短暂出现在屏幕上

Question

我正在使用 onItemTap() 事件路由到名为 'comdataApproval' 的新详细信息组件。在用户做一些事情之后，将他们导航回 'master component'。我不希望用户在从该详细信息组件重定向后能够导航回该详细信息组件。我使用 skipLocationChange: true 来尝试实现这一点。

当他们单击主要组件上的后退按钮时，它会按照您的预期进行操作，并将他们导航到他们在访问 'master component' 之前所在的组件。 但是， 在此过程中，'comdataApproval' 组件会在屏幕上显示一小段时间（不到一秒），然后用户会被导航到正确的组件。

 constructor(private router: RouterExtensions, private activatedRoute: ActivatedRoute, private comdataService: ComdataService) {
    // Use the component constructor to inject providers.        
}

  onItemTap(args){                    
    let navigationExtras : NavigationExtras ={
        queryParams: {
            index: args.index,
            comdataRecords: JSON.stringify(this.comdataRecords)
        },
        skipLocationChange: true
    };

    this.router.navigate(["/comdataApproval"], navigationExtras);        
}

导航回主组件。

 .then(() => {
         //do routing here
         this.router.navigate(["/comdata"]);
    });

我不确定为什么要显示此组件。这就像应用程序导航到详细信息组件，然后导航回历史记录中的正确组件。有什么办法可以防止这种短暂的 'pause' 发生吗？

编辑： 示例导航：

主页 -> comdataPage -> comdataApproval -> comdataPage

从这里可以按下后退按钮。如果按下它应该转到主页，而不是 comdataApproval 页面。但是，当按下它时，它会转到 comdataApproval 页面，然后转到主页，而不是直接转到主页。

Answer 1

首先，您必须隐藏默认的 NavigationButton 并放置您自己的 ActionItem，它看起来像一个后退按钮。在 Android，您还必须监听 activityBackPressed 事件并取消返回导航。

然后导航到 comdata，当用户点击您的 ActionItem（自定义后退按钮）时，clearHistory 标志设置为 true。对于 Android，您也必须在 activityBackPressed 事件中执行相同的操作，以便跨平台保持行为完整。

this.router.navigate(["/comdata"], { clearHistory: true });

Answer 2

我找到了适合我的情况的解决方案，希望它能帮助其他人。

导航： 主页 -> comdataPage -> comdataApproval -> comdataPage

我的问题是从 comdataApproval 到 comdataPage 我需要从 API 重新加载内容。这就是为什么我直接路由并在之前的路由中使用 skipLocation 的原因。为了避免暂停问题并重新加载内容，我使用了以下代码：

comdata批准：

this.router.backToPreviousPage();

comdata页面：

 this.page.on('navigatingTo', (data) => {
        if(data.isBackNavigation)
            this.ngOnInit();    
      }     
    )

然后在 ngOnInit 中调用 API。我仍然不知道为什么在使用 skipLocation 时会出现暂停问题。

此外，我不能使用 clearHistory，这是在另一个答案中建议的，因为当用户按下后退时，应用程序将关闭，而不是预期的导航到上一页。

在 NativeScript/Angular 应用程序中使用 skipLocationChange 会导致 'skipped location' 短暂出现在屏幕上

Using skipLocationChange in NativeScript/Angular app causes the 'skipped location' to appear briefly on the screen

angular

angular2-routing

nativescript