问题标签 [angular2-router]

给定一个 URL，例如/path/path2/path3/123;sdf=df和一个路由配置：

我需要的是找到所有段的实际配置，以便获得data所有级别（url 的每个段）上所有参数的结果集。

我可以通过例如拆分段中的 URL

或者更准确地说

这将返回

因此，将 URL 拆分为段不是问题。但是我需要为每个段获取配置。

我可以得到所有路线的实际配置

我可以通过配置树处理段并找出我需要的分支，但它可能会导致麻烦，例如在解决段:id时。create所以，我想使用路由器的方式来解决配置，如果内部路由器实现发生变化，我不需要改变我的。

示例：假设我有 50% 的 URL 由某个守卫保护（例如，只有登录的用户可以去那里），而其他 50% 不受保护（显示给所有人）。因此，在导航菜单级别（在 之外router-outlet）我只想显示与当前用户相关的链接，所以我需要知道哪些路线受到警卫的保护。警卫/数据/任何东西只是问题的一个特例。

请不要拘泥于示例，我正在寻找一种通用方法来获取特定 URL 的配置集。

这有可能吗？

TL;DR CanActivate 如何工作？

长版 这是我第一次看到客户端访问控制的实现。

在我目前使用的所有身份验证系统（例如 PHP 或其他服务器端编程语言）中，总是有一个函数检查用户是否已经登录，如果该函数返回 true，则服务器可以传递页面，否则用户被重定向到登录页面。

在这种情况下，客户端无法访问服务器代码，它只能发出请求并等待服务器组成页面，然后渲染它。

相反，Angular 的工作方式不同。它是一个使用 JavaScript 的客户端框架，每个人都可以看到它的代码。私人页面没有安全地放置在服务器内，唯一的服务器任务是交付 SPA，但它不能接受进一步的请求。

尽管如此，该框架仍将功能实现为 CanActivate，并且运行良好。所以我想知道是什么禁止我注入一些 JavaScript 代码和访问私人页面，即使我没有权限，或者更一般地说这个系统是如何工作的。在互联网上我没有找到足够的信息，也没有足够的技能来理解源代码。你能帮我澄清一下我的想法吗？

我可以问标题中的问题，但我更愿意告诉你我所知道的一切，所以如果有什么不对的地方，你可以纠正我。谢谢

在我的应用程序中，URLn 中可以有 n 个参数，然后它也可以有一个可选的跟随模式。例如，URL 可以是

http://example.com/{param1}

http://example.com/{param1}/constant/{id}

http://example.com/{param1}/{param2}/constant/{id}

http://example.com/{param1}/{param2}

http://example.com/{param1}/{param2}/{param3}

http://example.com/{param1}/{param2}/{param3}/constant/{id}

ETC

如何为这些类型的 URL 构建路由模块？

有没有办法获得路由器NavigationError事件原因？我需要对这种情况进行不同的处理

• canActivate 返回 false
• 找不到惰性路由块文件（捆绑更新，我需要为用户显示正确的消息以刷新页面）

我已经按照这里的建议在我的 ionic 2 应用程序中实现了后退按钮代码。但它没有按预期工作。

但是我在点击后退按钮时得到了 console.log() 。

下面是我的代码供参考。

1) app.routes.ts

2) app.component.ts

3) 订单.ts

在订单页面中，如果我单击后退按钮，它将调用 app.component.ts 中的函数，其中我将“activeView”作为未定义的let activeView = nav.getActive();行。所以，我得到“activeView is null”打印在控制台中。（如第一个解决方案中所述）。请看这张图片。

4) OrderDetails.ts

在 OrderDetails 页面中，如果我单击后退按钮，它将调用 OrderDetails.ts 中的函数，因为我正在覆盖 app.component.ts 的方法 （如这里this.platform.registerBackButtonAction(this.backButtonAction, 10);的第二个解决方案中所述）。我也在控制台日志中收到“backButtonAction called”。但它给了我在线错误。它在“this”中找不到 gotoOrders() 函数。在调试窗口中，我展开了“this”，但在那里看不到 gotoOrders() 函数。请看这张图片。this.gotoOrders();

我目前正在使用 angular2 和 material2。我的目标是在我的 routerLinkActive 处于活动状态时将 md-button 更改为 md-raised-button。例如，如果我在“/todos”上，我希望将“md-button”指令替换为“md-raised-button”。

我在互联网上找不到任何解决方案，希望有人能指导我。我很想避免使用 CSS 类。

谢谢你的帮助！

马修

按钮看起来像这样

我想检查/account/recovery/identification单击按钮后url 是否已重定向到

如果是锚标记解决方案，请在此处提供。我的问题是按钮标签。

我的测试规范看起来像这样。

但它并没有给我想要的结果，这是我得到的：

甚至buttonElements[0].nativeElement.click();似乎不起作用，因为没有注册点击事件。

我正在开发一个新的 SPA，其中有一个左侧导航菜单，并且此左侧导航菜单中的项目由 API 驱动。与仪表板 1、仪表板 2 一样

我创建了一个仪表板组件。当我单击 Dashboard1 时，我应该能够将 Dashboard1 传递给我的 Dashboard 组件并在右侧显示它。同样的情况，当我单击左侧导航中的 Dashboard2 时，我应该能够将 Dashboard2 传递给我的 Dashboard 组件并在右侧显示它。

我正在开发一个应用程序，我在其中配置了路由器插座，如下所示

所以当我点击第一个链接，即dashboard/1 时，页面会更新。当我单击第二个链接 dashboard/2 时，页面 URL 已更新，但视图未更新。但是当我进行刷新时，它正在更新。

我的Dashboardcomponent.html如下

我的仪表板组件.ts

在这里，我在我的视图中创建了两个锚点。获得 id 后，我会将其传递给 API 以获取小工具和数据及其列位置。我遍历小工具并将它们添加到锚点。

我正在开发一个新项目，并将使用 CLI 生成应用程序和所有文件，但是我遇到了一些对我来说似乎很臭的东西，我希望有更好的方法来做到这一点。

我的应用程序有路由，所以在我的测试中我需要导入RouterTestingModule来为路由器提供模拟。但是，由于我们创建的每个规范都将需要它，因此如果在创建新组件时默认包含它，那就太好了。我研究了对自定义蓝图的支持，但目前还没有任何支持，这很糟糕，因为如果我可以将该模块添加到蓝图中，这将非常简单。

默认情况下，还有哪些其他选项可以将其包含在所有规范中，而无需每个开发人员在创建新组件时记住添加它？