带有命名出口的 Angular 2/4 路由?

2023-12-03

我正在尝试在我的应用程序中实现命名出口。

这是我的路线配置:

    {
    path: 'contact',
    children: [
      { path: '', component: ContactComponent, pathMatch: 'full' },
      { path: 'list', component: ContactlistComponent },
      { path: 'hold', component: ContactOperationComponent, outlet: 'popup' }      
    ]
  }

这是我一直保留的OutletAppComponent与主要router-outlet

<router-outlet name="popup"></router-outlet>

这是我的 routerLink,它正在调用我的Component:

<a [routerLink]="['/contact',{outlets:{popup:['hold']}}]">Hold</a>

但是,这种方法生成的 URL 是一团糟。它看起来像这样:

/contact/(list//popup:hold)

应该是这样的

/contact/list(popup:hold)

因此我什至无法访问传递的参数来调用Component.

这里可能有什么问题?


None

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

带有命名出口的 Angular 2/4 路由? 的相关文章

随机推荐

  • 如何使用 VS2015 远程运行测试?

    我有一些 CodedUI 测试 我想在 Visual Studio 的远程计算机上运行 现在 过去您需要在某处安装一个测试控制器 在要运行的盒子上安装一个测试代理 让它们说话 然后使用指向该控制器的测试设置文件 我正在经历这个并在我的运行箱
  • 当应用程序处于工作模式时,UILocalNotification 不会触发

    关于为什么本地通知无法正常触发有很多问题here and there 还有几个关于为什么当应用程序处于后台状态时本地通知不会触发的问题 我也经历过them 但令我惊讶的是 我没有找到任何与前台状态或活动状态相关的通知帖子 即在我的应用程序中
  • 如何分组并获取具有最大值的元素 - javascript/node.js

    我有以下数组 我试图通过按 EntryId 分组来获取具有最大 id 的元素node js entryId 7wpNAXhYI id 5 entryId 7wpNAXhYI id 6 entryId 5PGB23RI id 7 entryI
  • Highcharts y 轴天花板未得到尊重

    我在使用 Highcharts 时遇到问题 其中两个 y 轴之一的上限没有得到尊重 Y 轴 1 代表百分比值 因此下限为 0 上限为 100 Y 轴 2 代表货币值 因此下限为 0 上限为null 由于某种原因 y 轴 1 的标签最多为 1
  • 使用 Flexbox 左对齐和居中对齐元素

    我正在使用 Flexbox 来对齐我的子元素 我想做的是将一个元素居中 并使另一个元素靠左对齐 通常我会使用设置左侧元素margin right auto 问题在于将中心元素推离中心 这可能吗without使用绝对定位 HTML 和 CSS
  • 找不到“laravel/homestead”框

    尝试配置 laravel 5 1 克隆了拉拉维尔 家园 将其克隆到之后Home目录 尝试运行 vagrant up 命令时抛出错误 如下所示 user user laravel homestead vagrant up Bringing m
  • 如何在不同的屏幕尺寸上得到完全相同的点?

    我想在用户点击特定区域时调用该操作 转到另一个视图 image 黑点 图像填充整个视图 内容模式为 Aspect Fit 问题是 当我将其设置在一种屏幕尺寸 例如 iPhone 8 上时 点击区域 会发生移动 我尝试使用按钮和约束或使用屏幕
  • 回归:导出的 Bash 函数在经过另一个过程后丢失

    从 Ubuntu 14 04 迁移到 16 04 时 我注意到我的几个 Bash 脚本由于缺少导出函数而失败 我想知道这是否与修复有关炮弹休克虫 尽管我只是简单地export f函数 而不依赖于 Bash 内部函数表示 仅当中间有另一个进程
  • 如何解决android studio中的gradle冲突?

    Please find my gradle file below 正如您所看到的 它显示红色 如果我将光标放在那里 我会得到提示 所有 com android support 库必须使用完全相同的版本规范 找到 com android su
  • 从asp.net代码获取某个网站的源代码

    有没有什么方法可以让我从 asp net 网站代码后面的一些 C 代码获取网站的源代码 最好是字符串 比如说 www google com 编辑 当然 我的意思是 html 代码 在每个浏览器中 您可以使用 viewsource 在上下文菜
  • 在 .net core、xUnit 项目中获取代码覆盖率

    我正在尝试使用以下方向的指示来获取 net core 项目中的代码覆盖率https github com Microsoft vstest docs blob master docs analyze md working with code
  • 从周日开始获取一周的问题

    以下是我创建的用于将星期日作为一周的开始日的函数 function getCurrentIntervalOfWeek liveratetime get start of each week dayofweek date w liverate
  • 变量仅在 for 循环内本地分配[重复]

    这个问题在这里已经有答案了 我正在做第一个 Kaggle 挑战 我对这种行为感到惊讶 组合由两个pd DataFrame组成 一个是训练集 另一个是测试集 我想删除两列 因此我创建了一个 for 循环来迭代组合中的项目 for datase
  • Python库“unittest”:以编程方式生成多个测试[重复]

    这个问题在这里已经有答案了 可能的重复 如何在 Python 中生成动态 参数化 单元测试 我有一个功能要测试 under test 以及一组预期的输入 输出对 2 332 234 99213 9 3 我希望这些输入 输出对中的每一对都单独
  • 如何将一组形状保存为 JPG 图像?

    我使用 VBA 在图像上放置了多个形状 并希望将整个组保存为 JPG Sub SaveImageTEST ActiveSheet Shapes Range Array Picture 1 SaveAsPicture worldmap jpg
  • Oracle语法左连接三个或更多表

    我正在尝试了解旧的 Oracle Left Join 语法 有两个表就可以了 FROM A B WHERE A Col B Col 我们将此查询称为 Q0 这很容易理解 例如和这个维恩diagram 但是 当我们添加第三个或更多表时 我的大
  • 使用程序进行短路评估

    我目前正在为一种非常有限的面向对象语言开发编译器 我想将所有值视为对象 并且这些值上的运算符将作为方法实现 编译器将程序转换为基于堆栈的虚拟机的汇编程序 在编译期间 我将整数文字转换为特殊 Integer 类的对象 算术运算符作为该类的方法
  • 错误:格式 %d 需要 int 类型,但参数 2 的类型为 double(*)(int, int)

    我似乎无法在 printf 语句中找出这个错误 每当我将格式说明符从整数更改为浮点时 反之亦然 我都会得到相同的错误 error format f expects type double but argument 2 has type do
  • 将 pandas 列从字符串季度和年份数组转换为日期时间列,其中列内存在混合格式

    这是我之前提出的问题的延伸 将 pandas 列从字符串 Quarters 和 Years 数组转换为日期时间列 我有一个像这样的数据框 其中日期混乱 我想将它们转换为日期时间对象 So 3Q 11会成为2011 09 30 Q1 20会成
  • 带有命名出口的 Angular 2/4 路由?

    我正在尝试在我的应用程序中实现命名出口 这是我的路线配置 path contact children path component ContactComponent pathMatch full path list component Co