Angular2 中未定义的路由器
Router undefined in Angular2
我想在用户验证成功后定义从我的登录到我的仪表板的重定向。但是当我在我的登录组件中实现 "this.router.navigate(['/dashboard'])" 时,它给了我错误:
"exception: undefined is not an object (evaluating 'this.router')"
我是这样实现这个功能的:
export class ContactComponent implements OnInit {
contactForm: FormGroup;
errorMsg:string = '';
constructor(private formBuilder: FormBuilder, private _router: Router) {
this._router = _router;
}
ngOnInit() {
this.contactForm = this.formBuilder.group({
username: ['', Validators.required],
password: ['', Validators.required],
});
DBEventProxy.instance(); // Init Eventbus
}
submitForm(): void {
DBEventProxy.instance().dbevent.login(this.contactForm['username'], this.contactForm['password'], this.loggedIn, this.failed);
}
loggedIn(): void {
this._router.navigate(['/dashboard']);
console.log("success");
DBEventProxy.instance().dbevent.register("disconnected", function (message) {
console.log("Client disconnected: " + JSON.stringify(message));
});
DBEventProxy.instance().dbevent.register("status", function (message) {
console.log("Client reconnected: " + JSON.stringify(message));
});
DBEventProxy.instance().dbevent.register("routeravailable", function (message) {
console.log("Router Available: " + JSON.stringify(message));
});
DBEventProxy.instance().dbevent.register("routerunavailable", function (message) {
console.log("Router Unavailable: " + JSON.stringify(message));
});
DBEventProxy.instance().dbevent.listen();
DBEventProxy.instance().dbevent.send({msgtype: "dashboardready"});
}
failed(message: string): void {
console.log("failed: " + message);
}
}
希望有人能帮助我!
更新:
当我使用我的登录信息登录时发生错误。我从服务器获得了我的 ConnectReply 并且连接存在。但是重定向不起作用。有多个错误。我将尝试在以下内容中显示这些内容:
- 异常:undefined 不是对象(正在计算 'this._router')
- 原始堆栈跟踪:(此处有许多文档和 handleErrors)
- TypeError: undefined 不是对象(正在计算 'this._router')
路由配置:
export const rootRouterConfig: Routes = [
{ path: 'dashboard', component: DashboardComponent },
{ path: 'contact', component: ContactComponent },
{ path: '', redirectTo: '/contact', pathMatch: 'full'}
];
试试这个
this._router.navigate(['dashboard']);
n 条路线。
export const rootRouterConfig: Routes = [
{ path: '', component: ContactComponent},
{ path: 'dashboard', component: DashboardComponent },
{ path: 'contact', component: ContactComponent },
{ path: '**', redirectTo: '' }
];
原回答
从构造函数中删除这一行:
this._router = _router;
在 TypeScript 中,当您将构造函数的参数声明为 public
或 private
时,将为您设置 class 属性。
更新
听起来 this._router
是在 this
不是您所期望的上下文中调用的。在 submitForm
方法中,尝试更改
this.loggedIn
到
()=>{this.loggedIn()}
我想在用户验证成功后定义从我的登录到我的仪表板的重定向。但是当我在我的登录组件中实现 "this.router.navigate(['/dashboard'])" 时,它给了我错误: "exception: undefined is not an object (evaluating 'this.router')"
我是这样实现这个功能的:
export class ContactComponent implements OnInit {
contactForm: FormGroup;
errorMsg:string = '';
constructor(private formBuilder: FormBuilder, private _router: Router) {
this._router = _router;
}
ngOnInit() {
this.contactForm = this.formBuilder.group({
username: ['', Validators.required],
password: ['', Validators.required],
});
DBEventProxy.instance(); // Init Eventbus
}
submitForm(): void {
DBEventProxy.instance().dbevent.login(this.contactForm['username'], this.contactForm['password'], this.loggedIn, this.failed);
}
loggedIn(): void {
this._router.navigate(['/dashboard']);
console.log("success");
DBEventProxy.instance().dbevent.register("disconnected", function (message) {
console.log("Client disconnected: " + JSON.stringify(message));
});
DBEventProxy.instance().dbevent.register("status", function (message) {
console.log("Client reconnected: " + JSON.stringify(message));
});
DBEventProxy.instance().dbevent.register("routeravailable", function (message) {
console.log("Router Available: " + JSON.stringify(message));
});
DBEventProxy.instance().dbevent.register("routerunavailable", function (message) {
console.log("Router Unavailable: " + JSON.stringify(message));
});
DBEventProxy.instance().dbevent.listen();
DBEventProxy.instance().dbevent.send({msgtype: "dashboardready"});
}
failed(message: string): void {
console.log("failed: " + message);
}
}
希望有人能帮助我!
更新: 当我使用我的登录信息登录时发生错误。我从服务器获得了我的 ConnectReply 并且连接存在。但是重定向不起作用。有多个错误。我将尝试在以下内容中显示这些内容:
- 异常:undefined 不是对象(正在计算 'this._router')
- 原始堆栈跟踪:(此处有许多文档和 handleErrors)
- TypeError: undefined 不是对象(正在计算 'this._router')
路由配置:
export const rootRouterConfig: Routes = [
{ path: 'dashboard', component: DashboardComponent },
{ path: 'contact', component: ContactComponent },
{ path: '', redirectTo: '/contact', pathMatch: 'full'}
];
试试这个
this._router.navigate(['dashboard']);
n 条路线。
export const rootRouterConfig: Routes = [
{ path: '', component: ContactComponent},
{ path: 'dashboard', component: DashboardComponent },
{ path: 'contact', component: ContactComponent },
{ path: '**', redirectTo: '' }
];
原回答
从构造函数中删除这一行:
this._router = _router;
在 TypeScript 中,当您将构造函数的参数声明为 public
或 private
时,将为您设置 class 属性。
更新
听起来 this._router
是在 this
不是您所期望的上下文中调用的。在 submitForm
方法中,尝试更改
this.loggedIn
到
()=>{this.loggedIn()}