Question

我正在使用棱角2.4.10。通过单击侧面菜单项，我使用路由器浏览我的站点：

import { ModuleWithProviders } from '@angular/core';
import { RouterModule } from '@angular/router';

... 
import { PartsComponent } from './parts/parts.component';
...

export const brambleRouting: ModuleWithProviders = 
RouterModule.forChild([
{
    path: '',
    component: BrambleRoot,
    canActivate: [AuthGuard],
    children: [
        ...
        {path: 'parts', component: PartsComponent},
        ...
        {path: 'model-builder', component: ModelBuilderComponent}
    ]
}
]);

如您所见，我可以使用路径和相关的PartsComponent导航到Parts组件。

现在导航到ModelBuilderComponent的代码不是我想要的。 ModelBuilderComponent有一个包含模态弹出窗口的HTML文件。如何为模型构建器定义路径，以便我的应用程序保留在当前页面上并调用ModelBuilderComponent中的open-dialogue（）函数？谢谢你的帮助，迪诺。

Answer 1

您可以使用partsComponent和ModelBuilderComponent之间的公共服务来实现。在服务中创建一个可观察变量并在ModelBuilderComponent组件中对其进行订阅，以便每次任何其他组件更改该变量时，都会在ModelBuilderComponent中调用subscribe方法。所以你可以做你想做的事情..

Answer 2

您可以尝试将导航额外选项replaceUrl传递给false并将skipLocationChange传递给true

this.router.navigate(['/model-builder], { replaceUrl: false, skipLocationChange: true });

Answer 3

不确定以下是否是解决问题的正确方法，但它确实有效。最后，我将templateUrl添加到侧面菜单templateUrl：

<model-builder></model-builder>

现在在side-menu.component.ts中我可以运行openDialog（）函数并在当前页面的顶部显示模态而不会重定向到模型构建器页面。请随时发表评论并提出更好的解决方案。

angular 2 routing：如何强制应用程序停留在当前页面并打开对话框

3 个答案: