ActivatedRouteSnapshot和ActivatedRouteAngular 4有什么区别？这是我的理解,ActivatedRouteSnapshot是一个孩子ActivatedRoute,意味着ActivatedRoute包含ActivatedRouteSnapshot.
顺便提一下,我尝试在谷歌搜索中搜索这个问题的答案,但我没有发现任何搜索结果是可以理解的.
谢谢!
我们假设我得到了这个路由器配置
export const EmployeeRoutes = [
{ path: 'sales', component: SalesComponent },
{ path: 'contacts', component: ContactsComponent }
];
并已导航SalesComponent到此URL
/department/7/employees/45/sales
现在我想去contacts,但因为我没有绝对路线的所有参数(例如7上面例子中的部门ID ),我宁愿使用相对链接到达那里,例如
[routerLink]="['../contacts']"
要么
this.router.navigate('../contacts')
不幸的是,这不起作用.可能有一个明显的解决方案,但我没有看到它.有人可以帮帮忙吗？
我发现许多ActivatedRouteObservables喜欢params或url订阅但未取消订阅的例子.
constructor(private route: ActivatedRoute) {}
ngOnInit() {
this.route.params
// (+) converts string 'id' to a number
.switchMap((params: Params) => this.service.getHero(+params['id']))
.subscribe((hero: Hero) => this.hero = hero);
}
Observable？Router.routerState？我正在使用angular2路由器.
要绘制网址的面包屑,请说site.com/a/b/c/15我执行以下操作:
site.com/a/b/c/15并获得与路线相关联的漂亮名称site.com/a/b/c并获得与路线相关联的漂亮名称site.com/a/b并获得与路线相关联的漂亮名称site.com/a并获得与路线相关联的漂亮名称所以我想说我有以下路线:
{ path: 'a', component: A, data:{prettyName: 'I am A'}}
{ path: 'b', component: B, data:{prettyName: 'I am B'}},
{ path: 'c', component: C, data:{prettyName: 'I am C'}},
我的过程的结果将是一个包含的数组,{"I am C", "I am B", "I am C"}并且由于我可以显示一个很好的面包屑"I am A > I am B > I am C"来解释当前的路线.
这用于使用路由器弃用的操作
this.router.recognize(url).then((instruction) => {
instruction.component.routeData.get('prettyName') // Would return 'I am ..'
但是现在; 使用最后一个路由器,我无法再处理这个识别逻辑. …
我需要在Angular 2中获得没有params的当前路由,我找到了一种方法来获取当前路径的params,如下所示:
this.router.url
然后分开它:
this.router.url.split(';')[0]
但这看起来像是解决方法,我认为应该有更好的方法吗？
在给定条件的情况下,我想异步地将一个组件附加到路由.
以下示例(可以是异步的)根据用户角色加载一个或另一个组件:
import { UserDashboardComponent } from './user-dashboard.component'
import { AdminDashboardComponent } from './admin-dashboard.component'
const role = 'admin' // Just for the example
const comp = role === 'admin' ? AdminDashboardComponent : UserDashboardComponent
const routes: Routes = [
{ path: '', component: comp },
]
但是,假设我们想要从API检索角色,从而异步.有什么方法可以实现这一目标？
尝试切换到新的路由器,如版本"@ angular/router":"3.0.0-beta.2"与"@ angular/*":"2.0.0-rc.4"组合,遵循官方文档ComponentRouter.
但是,当我尝试使用默认的HomeComponent加载我的应用程序时,我遇到了一个问题:
Cannot find primary outlet to load 'HomeComponent'
这似乎与使用templateUrl和外部html文件而不是使用内联模板样式有关.
HomeComponent最初未显示在Window中,错误将打印到控制台.但是,当我使用Home Component的链接时,它会显示为秒针.
我一改变
templateUrl: 'home.html'
至
template: '<router-outlet></router-outlet>'
错误消失,HomeComponent显示,路由按预期工作.
这是一个已知问题吗？它对使用templateUrl的人有用吗？为了让它发挥作用,有什么我必须尊重的吗？
我用这个:
import { HttpParams } from '@angular/common/http';
let params = new HttpParams();
params.append('newOrdNum','123');
但这不起作用,我不会在网址中附加param.有什么建议吗？
请考虑以下路由配置:
const routes: Routes = [
{
path: '',
component: AppComponent,
resolve: {
app: AppResolver
},
children: [
{
path: 'user/:uid',
resolve: {
user: UserResolver
},
children: [
{
path: '',
component: ViewUserComponent
},
{
path: 'edit',
component: EditUserComponent
}
]
}
]
}
];
用户数据由UserResolver路径的任何子节点检索/user/:uid.使用此数据,可以通过导航到导航到/user/:uid然后编辑来查看用户配置文件/user/:uid/edit.成功编辑后,可能会重定向到用户的更新配置文件(/user/:uid).
但是,视图和编辑页面都是已解析路径的子项,当从一个路径导航到另一个路径时,不会触发解析器.
因此,当从编辑组件导航回视图组件时,显示的数据仍然是旧的,未更新的数据.
是否有办法使已解析的user数据无效以强制解析器再次从服务器获取它？或者有没有其他方法来实现这种结果？
该app数据是不变的,我们不应该重新加载它.
我想有两个顶级路径用于登录和注册.
我宁愿没有做auth/log-in和auth/register.
但是,auth组件位于一个单独的模块中,这很好,因为除非特别要求,否则不应加载它.
export const routes: Route[] = [
{ path: 'log-in', loadChildren: './auth-module/auth.module#AuthModule'},
{ path: 'register', loadChildren: './auth-module/auth.module#AuthModule'}
];
我如何指定何时定义我希望log-in路径转到延迟加载的AuthModule 内部路径的log-in路径,以及转到延迟加载模块内部路径的路径？registerregister