- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我不确定这是否是实现它的最佳方式。如果您有其他意见,请分享。
我必须实现一个多收件箱系统,用户可以将多封电子邮件分组到不同的收件箱中。
例如:http://localhost/inbox/personal/
将显示 personal
收件箱中的电子邮件列表,http://localhost/inbox/business/3
将显示 business
收件箱中的电子邮件列表,并突出显示 ID 为:3
路线看起来像这样:
const routes: Routes = [
{
path: '',
pathMatch: 'full',
redirectTo: 'personal' // redirect to personal inbox
},
{
path: ':inbox',
component: InboxContentComponent, // list of emails in :inbox
children: [
{
path: '',
component: InboxNoSelectedEmailComponent, // no email selected
},
{
path: ':id',
component: InboxSelectedEmailComponent, // show selected email content
}
]
}
];
我的问题是 InboxContentComponent
。我需要检测收件箱何时更改以及是否选择了电子邮件
constructor(private route: ActivatedRoute) {
}
ngOnInit() {
this.route.paramMap.subscribe(inbox => {
console.log('inbox', inbox);
});
}
事件仅在收件箱更改时发出,而不是在电子邮件更改时发出。有没有办法检测子路由参数何时更改?
执行此 this.route.firstChild.paramMap.subscribe();
只有在组件初始化时路由有第一个子节点时才有效。如果路由是这样的 http://localhost/inbox/business/
那么 this.route.firstChild
是 null
我能想到的解决方案是像这样定义路由
{
path: ':inbox/:id',
component: InboxContentComponent
}
然后检查 InboxContentComponent
是否设置了 :id
有什么想法吗?
最佳答案
为了解决这类问题,我会监听路由器事件并检索我想要的内容。像这样:
import { Router, ActivatedRoute, NavigationEnd } from '@angular/router';
import { filter, map, mergeMap, tap } from 'rxjs/operators';
// ...
constructor(
// ...
private activatedRoute: ActivatedRoute,
private router: Router
) {
this.router.events
.pipe(
filter((event) => event instanceof NavigationEnd),
map(() => this.activatedRoute),
map((route) => {
while (route.firstChild) route = route.firstChild;
return route;
}),
mergeMap((route) => route.paramMap),
tap(
paramMap => console.log('ParamMap', paramMap)
)
).subscribe(
(paramAsMap) => // Get the params (paramAsMap.params) and use them to highlight or everything that meet your need
)
}
您可以根据自己的需要进行调整。参数?突出显示:无突出显示。
关于angular - ActivatedRoute 订阅第一个子参数观察者,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48977775/
AngularFire2 文档演示了以下将观察者绑定(bind)到您的 Firebase 可观察对象的模式: this.item = af.database.object('/item'); {{ (
我正在使用观察者模式和 BlockingQueue 添加一些实例。现在在另一种方法中,我正在使用队列,但似乎 take() 一直在等待,即使我这样做: /** {@inheritDoc} */ @Ov
我遇到问题 - 创建具有不同属性的订单。在我的工作案例中,用户有大约 10 个不同的属性,每个属性有 3-4 个变体。 我正在使用 Angular js,并编写了两个函数: 二传手 $scope
我尝试将额外的产品添加到购物车。我为此创建了一个观察者。 getEvent()->getControllerAction()->getFullActionName() == 'checkout_car
我尝试将额外的产品添加到购物车。我为此创建了一个观察者。 getEvent()->getControllerAction()->getFullActionName() == 'checkout_car
假设我想创建一组基于类型的观察者。也就是说,当他们收到事件通知时,他们会被告知其中一个参数的类型,然后根据是否可以对该类型进行操作来决定是否采取行动。 有没有简单的方法可以做到这一点?我认为这对于泛型
快速提问。 当 setChanged() 和 notifyObservers() 被调用并且 Observer.update() 运行时,它是否在一个新的 Thread,还是在同一个Thread中?
我必须为可观察对象和观察者创建代码。正如您所知,每个观察者都有自己的“更新”方法。 在我的可观察代码中,我使用了“notifyObservers”方法。它的参数是一个字符串数组,其中包含有关我的项目的
是否有一种设计模式可以形成“复合”观察者/可观察对象? 我的意思是我有一个可观察的 A 通知它的听众一些变化。 每个监听器也是一个可观察对象,并通知自己的监听器(在它执行的某些操作中,哪个操作是由第一
我对以下代码为何不起作用感到有点困惑: MutableLiveData mutableTest = new MutableLiveData<>(); MediatorLiveData mediator
场景:我有两个名为 FirstFragment 的 fragment 和 UnitFragment .我来自 FirstFragment至UnitFragment选择一个单位返回FirstFragme
我想了解如何 平面 map 作品。我知道这是处理 Observable> 的一种方式。 无论如何,我正在测试它的行为并陷入困境: let plusDom = document.querySelecto
我有 public class mammal implements Imammle { public String getName() { return "Mammal";
如果我使用 KVO 来观察我的播放器项目,如下所示: AVPlayerItem *playerItem = [AVPlayerItem playerItemWithURL:url];
我想在正在使用的变量上使用观察者,这是我的代码: const get = Ember.get; uploader:Ember.inject.service('uploader'), progressC
我一直在使用Laravel Observers每当我的模型被删除/更新/保存时处理我的应用程序逻辑。我注意到在某些情况下这些观察者不会被触发。例如,如果我使用 Model::where(active,
我有一个工作人员服务来发送一些简单的通知。但现在,我想在发送之前检查数据库中的一些数据。 但是,我不能在工作线程中使用观察者,它必须在主线程中。我有一个错误类型 java.lang.IllegalSt
我有 2 个字段:美元和日元。当我更改美元字段时,我想在日元字段中显示转换后的数字,反之亦然。 我的问题是这样的: 如果我有 2 个带有观察者的字段,例如: addTextChangedListene
在 View Controller 中,我创建了一个 subview 数组,可以随时从父 View 中删除,因此它们的生命周期比 View Controller 的生命周期短。 创建它们时,我几乎这样
如何在另一个线程上运行 RxJava,因为主线程上的工作太多。 我在一个方法内运行观察者,下面是代码 fragment : public void updatePie() { RxJavaPlugin
我是一名优秀的程序员,十分优秀!