问题标签 [angular2-router]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
4071 浏览

angular - Angular2 路由访问被拒绝逻辑

我正在尝试对路由进行访问检查并显示拒绝访问页面而不是实际页面。从下面的示例中,我们可以在路由 click 上提醒访问被拒绝。我宁愿导航到实际页面,然后显示拒绝访问。

http://plnkr.co/edit/w1NCkGs0Tv5TjivYMdvt?p=preview

假设带有访问检查的 url 是/admin/manageusers和组件名称是ManageUserComponent,如果用户无权访问并尝试 url,它应该导航到路由/admin/manageusers 但应该显示Access Denied in the page.

1.我可以做的一件事是使用路由resolve功能并获取与用户访问ManageUserComponent和切换模板相关的值。这种方法最终将在与我想要实现访问逻辑的路由关联的多个组件中具有相似的代码。

  1. 让所有component需要访问检查的地方扩展另一个base class并验证上述逻辑,如果成功则允许子组件继续。尚未弄清楚如何正确扩展另一个类

主要目标是在页面中保留带有错误消息的访问 url。并且组件功能不应该执行。

如果您能想到实施的方法和选项,请分享。

如果描述不清楚,请告诉我,我会尽力使它更好。

0 投票
1 回答
2938 浏览

angular - 设置activatedRoute可选参数“id”,根本不导航

我有一个搜索过滤器页面,它显示搜索的产品,并且当用户单击搜索的产品时,还以模式显示产品详细信息。

我现在想在用户单击产品时以编程方式设置已激活路由的现有 id 可选参数。这就是为什么它是可选的 - 在第一次加载时,它没有参数,直到用户点击它 - 然后他们可以通过从浏览器 url 复制并粘贴它来共享该链接到特定产品。

这是我尝试以编程方式设置可选参数:

路线:

设置激活路由 id 可选参数:

理想情况下,我想删除底线以停止物理导航,这是浪费资源

编辑:这似乎有效:

但是它不会更改网址,我猜是因为它不会再次加载页面

0 投票
3 回答
1621 浏览

angular - 获取组件中Angular2 Route中canActivate方法返回的值?

我在 Angular2 中创建了一个身份验证管理器来直接限制组件访问。我对角度和学习概念仍然很陌生。

如果用户名不正确,我可以限制用户。但我无法使用组件中的 canActivate 方法返回的值在前端显示消息。

我的 AuthManager 类

我可以看到您未在日志中授权,但如何在组件中使用该值。

我的 app.router.ts

0 投票
1 回答
60 浏览

angular - angular2路由器的奇怪“状态”查询参数行为

我没有找到任何关于 Angular 2 路由器这种宝贵行为的文档:如果我使用“状态”查询参数加载我的应用程序,路由器会自动导航到给定状态。

我偶然发现了这一点,正在寻找解决我的问题的方法,但是我需要解析一些其他查询参数,而在这里我正在丢失它们。

例如:http://my.app/?state=#/screen1&anotherParam=something自动将我的应用程序“重定向”到http://my.app/#/screen1,然后我就输了anotherParam

这是未记录的功能还是错误?或者你有没有看到我错过了关于这种行为的任何页面?

0 投票
2 回答
7497 浏览

angular - 切换并保留 ng2-bootstrap 的选定选项卡,使用 Angular 路由器

我有一个使用ng2-bootstrap tabsettab.

例子:

注意:tabs[N].active由组件控制,并且已经同步选项卡更改和路由。但我觉得我做错了,因为很难在选定的选项卡内管理路由。让我们看第二个选项卡,在一天结束时它应该管理以下子路线:

这并不容易,因为显示选项卡的组件已经使用了这条路线:

如果有这样的事情会容易得多:

有没有人解决这个问题?这个问题应该很常见。。。

0 投票
1 回答
451 浏览

angular - 没有路由更改/历史记录的 Angular 2 路由器

我喜欢 Angular 2 路由器的好处,例如 Guards、Resolver、使用 navigateTo 等。

但在我的应用程序中,我根本不想改变路线。所以它应该始终保持“/”而不改变浏览器历史记录。那可能吗?

0 投票
1 回答
631 浏览

angular - 如何在 Angular 2 中解析路由参数

我有路线配置

我需要检查:category路由参数值是否作为搜索类别存在于数据库中,如果存在则激活路由,否则转到 404 页面(在本例中为 PageNotFoundComponent)。

使用 CanActivate 是最好的方法吗?导航到 404 页面怎么样?

0 投票
2 回答
16357 浏览

angular - Angular2 路由器:错误:找不到加载“InboxComponent”的主要出口

我创建了一个带有路由的简单应用程序。链接“ http://localhost:4200 ”和“ http://localhost:4200/mail ”运行良好,

但是当我尝试打开一个链接“ http://localhost:4200/mail/inbox ”时,我得到一个错误:“找不到加载'InboxComponent'的主要出口”。

是什么导致了错误,我该如何解决?

这是我的 *.ts 文件:

app.module.ts

app.component.ts

文件夹.component.ts

邮件列表.component.ts

收件箱.component.ts

0 投票
2 回答
1214 浏览

angular - Angular 2 路由守卫不等待设置值

我有这个路由守卫,它应该检查用户的角色以及roleAccess路由定义中定义的属性。

我面临的问题是.map不管 是否都执行,只有当它是错误的accounts.isSelfPending(它从 开始)才允许运行。null@ngrx/store.map

我怎样才能做到这一点?

编辑:我意识到我的问题可能有点含糊,我需要等待来自/self组件层次结构更高层的请求中的用户信息,并存储在商店中。

现在的问题是,/self尽管在 my 中触发了请求,但该请求甚至没有被触发,而 myDashboardComponent又将其AdsComponent作为路由中的子节点之一。(这是我目前试图用这个守卫锁定的路线)。

为什么它甚至不触发/self请求?我认为这是这个问题的一部分。

0 投票
0 回答
471 浏览

angular - Angular2 - 错误:找不到加载“ChildComponent”的主要出口

PS:我已经引用了有关此标题引用的所有问题,并在我的代码中更正了这些项目。

我有主页(登录后),其中包含<router-outlet name="mainoutlet"></router-outlet>加载其子页面的内容。子页面是延迟加载行为,所以我有一个如下的路由结构(app.module.ts),但是即使它的父页面(HomeComponent)有一个下面的错误<router-outlet>

Error: Cannot find primary outlet to load 'ChildComponent'

注意:app.comonent.html<router-outlet>已经区分了家庭控制器的路由器,我给了一个 name=mainoutlet。

app.component.html

app.compoenent.ts

app.module.ts

home.component.html

home.component.ts

child.component.html

child.component.ts

包.json