在应用程序加载时强制重定向到特定页面
在应用程序加载时强制重定向到特定页面
提问于 2016-10-15 06:15:43
我正在尝试设置我的角2应用程序到默认的页面加载路由，不管它是什么路由，但我似乎无法让它工作。
我在应用程序组件的ngOnInit中添加了逻辑，以重定向到我的主路由，但它被忽略了。
import {Component, OnInit} from '@angular/core';
import {Router} from "@angular/router";
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
constructor(private router: Router) {}
closeApplication() {
electron.ipcRenderer.send('close-app');
}
ngOnInit() {
console.log('I am being run.');
this.router.navigate(['']);
}
}这是我的路由配置
import {LoginComponent} from "./login/login.component";
import {HomeComponent} from "./home/home.component";
import {AuthGuard} from "./shared/security/auth.guard";
import {RegisterComponent} from "./register/register.component";
import {ListingComponent} from "./listing/listing.component";
import {RedirectGuard} from "./shared/security/redirect.guard";
import {WelcomeComponent } from "./welcome/welcome.component";
export const routerConfig = [
{ path: 'login', component: LoginComponent, canActivate: [RedirectGuard] },
{ path: 'register', component: RegisterComponent, canActivate: [RedirectGuard] },
{ path: 'home', component: HomeComponent, canActivate: [AuthGuard],
children: [
{
path: '',
component: ListingComponent
},
{
path: 'listing/:id',
component: ListingComponent
}
]
},
{ path: '', component: WelcomeComponent },
{ path: '**', component: HomeComponent },
];对于某些上下文，我正在创建一个具有线性用户流的电子应用程序，如果用户在默认页面上启动该应用程序，它将工作得非常出色。如果我在第3页上并刷新，整个应用程序状态都不正常。我不使用数据库来保留状态，我认为存储在本地存储对我的最终目标来说是一种负担。
干杯!
回答 2
Stack Overflow用户
回答已采纳
发布于 2017-01-31 00:10:34
我刚刚将以下体系结构实现到一个项目中，在该项目中，我创建了一个redirect.component，该项目解决了课程加载后的位置问题。以下是一个超级简化的版本；
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-redirect',
template: ``
})
export class RedirectComponent implements OnInit {
private goDownPathOne: boolean = true;
constructor() { }
ngOnInit() {
if(goDownPathOne)
this.router.navigate('path1');
else
this.router.navigate('path2');
}
}然后，在我的app.routing中，我有以下内容：
const COURSE_ROUTES: Routes = [
// Home / Menu Screen
{ path: '', component: RedirectComponent },
// Default Routes
{ path: 'screen', redirectTo: '/', pathMatch: 'full' },
{ path: 'text', redirectTo: '/', pathMatch: 'full' },
{ path: 'activity', redirectTo: '/', pathMatch: 'full' },
{ path: '**', redirectTo: '/', pathMatch: 'full' }
];
export const courseRouting: ModuleWithProviders = RouterModule.forRoot(COURSE_ROUTES);因此，在应用程序加载时，它总是会转到RedirectComponent，然后由它决定我们应该在哪里处理所提供的数据--在我的例子中，我把它从数据库中拖了下来。我不确定这是否是最优的方法，但如果违抗有效！
Stack Overflow用户
发布于 2016-10-15 06:40:50
尝试设置一个适当的路由器配置。在配置路由时，还可以使用通配符设置重定向
{path: '**', redirectTo: 'your-defaultPath', pathMatch:'full'}
有关路由文档路由器的更多信息，请查看完整的angular2。
这里是一个简单的例子‘家’和‘其他’路线。空的‘路由’被重定向到' home‘，而任何不匹配的路由都被重定向到家乡。
import {BrowserModule} from '@angular/platform-browser'
import {Component, NgModule} from '@angular/core'
import {RouterModule} from '@angular/router';
@Component({selector: 'app', template: 'App Shell<br> <router-outlet></router-outlet>'})
export class AppComponent {}
@Component({selector:'home', template:'Home component'})
export class HomeComponent {}
@Component({selector:'other', template:'Other component'})
export class OtherComponent {}
@NgModule({
imports: [
BrowserModule,
RouterModule.forRoot([
{path:'home', component: HomeComponent},
{path:'other', component: OtherComponent},
{path:'', redirectTo:'home', pathMatch:'full'},
{path:'**', redirectTo:'home'}
], {enableTracing:true})
],
declarations: [AppComponent, HomeComponent, OtherComponent],
bootstrap: [AppComponent]
})
export class AppModule {}注意，我将enableTracing选项设置为true，以获得有关导航的更多信息。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/40055668
复制相关文章
相似问题
腾讯云开发者
