typescript angular 7 重定向到另一个页面
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/54252321/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
angular 7 redirecting to another page
提问by Ben
I have a login page and a dashboard component.My problem is when i login from the page the dashboard displays below the login page, it is not redirecting as a new page.How to achieve this in angular 7? Any help would be helpful'. Thanks!!
我有一个登录页面和一个仪表板组件。我的问题是当我从仪表板显示在登录页面下方的页面登录时，它没有作为新页面重定向。如何在 angular 7 中实现这一点？任何帮助都会有所帮助'。谢谢！！
app.component.ts
app.component.ts
import { Component } from '@angular/core';
import { Router } from '@angular/router';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'Shopping-cart';
user = []
users = []
public Candidate = []
public showWhen:boolean = false;
constructor(private _router: Router){}
authenticateLogin(user){
let authUser = JSON.parse(localStorage.getItem('auth'))
console.log(user);
if(user.mail === authUser[0] && user.password === authUser[1]){
this.showWhen = true;
console.log("Logged in Successfully");
this._router.navigate(['dashboard']);
} else {
console.error("Invalid email and password");
}
}
}
This is my routing-module
这是我的路由模块
app-routing.module.ts
app-routing.module.ts
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { DashboardComponent } from './dashboard/dashboard.component';
const routes: Routes = [
{ path: 'dashboard', component: DashboardComponent}
];
@NgModule({
imports: [RouterModule.forRoot(routes, { enableTracing: true })],
exports: [RouterModule]
})
export class AppRoutingModule { }
采纳答案by Kamil Kie?czewski
In Routesyou have only one route - to dashboard - make second route to login
在Routes你只有一条路线 - 到仪表板 - 做第二条路线登录
回答by user8009263
You should have another route to the login page. Without having that, you can't make any call to the login page.
您应该有另一条通往登录页面的路线。没有它，您将无法对登录页面进行任何调用。
In your part of code, Try these chunks of code
在您的代码部分，尝试这些代码块
app.component.ts
app.component.ts
authenticateLogin(user){
let authUser = JSON.parse(localStorage.getItem('auth'))
console.log(user);
if(user.mail === authUser[0] && user.password === authUser[1]){
this.showWhen = true;
console.log("Logged in Successfully");
this._router.navigate(['dashboard']);
} else {
this._router.navigate(['login']);
}
}
and you should have another router pathin
你应该有另一个路由器路径中
app-routing.module.ts
app-routing.module.ts
const routes: Routes = [
{ path: 'dashboard', component: DashboardComponent} ,
{ path: 'login', component: LoginComponent(write your login component name)}
];
回答by Sergey Ivchenko
Maybe for a login form, create your own component and add it to the route.
也许对于登录表单，创建您自己的组件并将其添加到路由中。
