我的eventAggregator工作在我的项目的所有其他部分。我有两个根,我使用eventAggregator将消息发布到消息div,它可以工作。
在我的公共根目录中,我有" public.ts"哪个有我的路线配置。在那里,我有一个PostRenderStep,我在其中发布消息..好吧,我发布一条空消息,强制消息消失。
这是我的PostRenderStep类:
class PostRenderStep {
constructor(private eventAggregator: EventAggregator) { }
run(navigationInstruction: NavigationInstruction, next: Next): Promise<any> {
console.log("I'm inside the POST activate step!")
return Promise.resolve()
.then(() => this.eventAggregator.publish('messages', new MessagePayload("", "", "")))
.then(result => next());
}
}
当我运行这个时,我得到两个错误 - 第一个是事件聚合器:
aurelia-logging-console.js:47 ERROR [app-router] TypeError: Cannot read property 'publish' of undefined
at public.ts:87
at <anonymous>
此错误发生后:
ERROR [app-router] Router navigation failed, and no previous location or fallbackRoute could be restored.
我怀疑带有导航的postRenderStep由于eventAggregator行而失败并导致第二个错误。
我对此进行了调查,以确定它是否是我的事件聚合器,它不是在公共根目录中工作但事实上我在更改了根目录后发布了一条消息,这显示其工作正常。我还放置了一个按钮,当点击它时发布了一个也有效的按钮表明它的工作 - 只是不在这个类中。
有人可以更详细地解释这个错误在说什么,以及为什么会发生这种错误以及如何解决它......
它完全适用于我的另一个根本,而不是在这个根本。
完整的public.ts文件
import { Aurelia, PLATFORM, autoinject } from 'aurelia-framework';
import {
Redirect,
NavigationInstruction,
Router,
RouterConfiguration,
Next,
PipelineProvider
} from "aurelia-router";
import { EventAggregator } from 'aurelia-event-aggregator';
import { Messages, MessagePayload } from '../../services/messages/messages'
@autoinject
export class Public {
public router: Router;
configureRouter(config: RouterConfiguration, router: Router): void {
this.router = router;
config.title = "Aurelia";
config.addPostRenderStep(PostRenderStep);
config.map([
{
route: ["", "home"],
name: "home",
settings: { icon: "home" },
moduleId: PLATFORM.moduleName("../components/home/home"),
nav: true,
title: "Home"
},
{
route: "counter",
name: "counter",
settings: { icon: "education", auth: false },
moduleId: PLATFORM.moduleName("../components/counter/counter"),
nav: true,
title: "Counter"
},
{
route: "fetch-data",
name: "fetchdata",
settings: { icon: "th-list", auth: false },
moduleId: PLATFORM.moduleName("../components/fetchdata/fetchdata"),
nav: true,
title: "Fetch data"
},
{
route: "login",
name: "login",
settings: { icon: "user", auth: false, },
moduleId: PLATFORM.moduleName("../components/login/login"),
nav: true,
title: "Login"
},
{
route: "notFound",
name: "notFound",
settings: { auth: false, },
moduleId: PLATFORM.moduleName("../components/notFound/notFound"),
nav: false,
title: "Not Found"
}
]);
config.mapUnknownRoutes('../components/notFound/notFound');
}
}
class PostRenderStep {
constructor(private eventAggregator: EventAggregator) { }
run(navigationInstruction: NavigationInstruction, next: Next): Promise<any> {
console.log("I'm inside the POST activate step!")
return Promise.resolve()
.then(() => this.eventAggregator.publish('messages', new MessagePayload("", "", "")))
.then(result => next());
}
}
答案 0 :(得分:5)
您autoinject
PostRenderStep
@autoinject
class PostRenderStep {
}