Question

我在登录注册时处理angular2应用程序，我对日志页面和其他页面有不同的布局。

这是应用程序组件的html

<div *ngIf="!authService.isLoggedIn()" class="log">
  <router-outlet></router-outlet>
</div>
<div *ngIf="authService.isLoggedIn()">
  <app-header></app-header>

  <section class="layout">
    <!-- sidebar menu -->

    <aside class="sidebar canvas-left">
      <!-- main navigation -->
      <app-sidebar></app-sidebar>
      <!-- /main navigation -->
    </aside>
    <!-- /sidebar menu -->

    <!-- main content -->
    <section class="main-content">
      <div class="content-wrap no-padding">
        <router-outlet></router-outlet>
      </div>
    </section>
  </section>
</div>

这是我的路线配置

const routes: Routes = [
  { path:'my-company', component:MyCompanyComponent, canActivate: [AuthGuardService] },
  { path:'my-web-supports', component:MyWebSupportsComponent, canActivate: [AuthGuardService] },
  { path:'my-statistics', component:MyStatisticsComponent, canActivate: [AuthGuardService] },
  { path:'my-acquired-leads', component:MyAcquiredLeadsComponent, canActivate: [AuthGuardService] },
  { path:'login', component:LoginComponent },
  { path:'logout', component:LogoutComponent },
  { path:'pass-forget', component:PassForgetComponent },

  // default
  { path:'', redirectTo: '/my-company/dashboard', pathMatch: 'full' },

];

const routesChild: Routes = [

  // Child route for my company
  { path:'my-company', component:MyCompanyComponent, canActivate: [AuthGuardService], children:[
    { path:'',component:DashboardComponent },
    { path:'dashboard',component:DashboardComponent },
    { path:'opening-hours',component:OpeningHoursComponent },
    { path:'offers',component:OffersComponent },
    { path:'personal-information',component:PersonalInformationComponent },
  ]},


];

@NgModule({
    imports: [ RouterModule.forRoot(routes),RouterModule.forChild(routesChild) ],
    exports: [ RouterModule ]
})
export class AppRoutingModule {}

 // the authGuard service
@Injectable()
export class AuthGuardService implements CanActivate {

  constructor(private auth: AuthService, private router: Router) { }

  canActivate() {
    if (!this.auth.isLoggedIn()) {
      this.router.navigateByUrl('/login');
      return false;
    }
    return true;
  }

}

当我登录时，我有标题和侧边栏但我没有内容，路由器插座似乎不起作用。如果我刷新，它运作良好。当我退出时，登录页面是空的，但如果我刷新页面，它的工作正常。

为什么登录和注销后路由器插座是空的？（我没有错误）

注销angular2后路由器出口空

0 个答案: