添加路由守卫

index/src/app/view/admin/admin-routing.module.ts

@@ -10,19 +10,27 @@ import {AdminUpdateComponent} from './admin-update/admin-update.component';
 import {AdminUserComponent} from './admin-user/admin-user.component';
 import {AdminUserinfoComponent} from './admin-userinfo/admin-userinfo.component';
 import {AdminVisitorComponent} from './admin-visitor/admin-visitor.component';
+import {AdminComponent} from './admin.component';
+import {AuthGuard} from './auth.guard';
 
 
 const routes: Routes = [
-    {path: 'article', component: AdminArticleComponent},
-    {path: 'comment', component: AdminCommentComponent},
-    {path: 'category', component: AdminCategoryComponent},
-    {path: 'link', component: AdminLinkComponent},
-    {path: 'tag', component: AdminTagComponent},
-    {path: 'update', component: AdminUpdateComponent},
-    {path: 'user', component: AdminUserComponent},
-    {path: 'userInfo', component: AdminUserinfoComponent},
-    {path: 'visitor', component: AdminVisitorComponent},
-    {path: '**', component: AdminIndexComponent}
+    {
+        path: '',
+        component: AdminComponent,
+        children: [
+            {path: 'article', component: AdminArticleComponent, canActivate: [AuthGuard]},
+            {path: 'comment', component: AdminCommentComponent, canActivate: [AuthGuard]},
+            {path: 'category', component: AdminCategoryComponent, canActivate: [AuthGuard]},
+            {path: 'link', component: AdminLinkComponent, canActivate: [AuthGuard]},
+            {path: 'tag', component: AdminTagComponent, canActivate: [AuthGuard]},
+            {path: 'update', component: AdminUpdateComponent, canActivate: [AuthGuard]},
+            {path: 'user', component: AdminUserComponent, canActivate: [AuthGuard]},
+            {path: 'userInfo', component: AdminUserinfoComponent, canActivate: [AuthGuard]},
+            {path: 'visitor', component: AdminVisitorComponent, canActivate: [AuthGuard]},
+            {path: '**', component: AdminIndexComponent, canActivate: [AuthGuard]}
+        ]
+    }
 ];
 
 @NgModule({

index/src/app/view/admin/admin.component.html

@@ -0,0 +1,12 @@
+<p>admin works!</p>
+<a routerLink="/admin">indec</a>
+<a routerLink="/admin/article">article</a>
+<a routerLink="/admin/category">category</a>
+<a routerLink="/admin/comment">comment</a>
+<a routerLink="/admin/link">link</a>
+<a routerLink="/admin/tag">tag</a>
+<a routerLink="/admin/update">update</a>
+<a routerLink="/admin/user">user</a>
+<a routerLink="/admin/userInfo">userInfo</a>
+<a routerLink="/admin/visitor">visitor</a>
+<router-outlet></router-outlet>

index/src/app/view/admin/admin.component.less

@@ -0,0 +1,4 @@
+a{
+  margin: 5px;
+  padding: 10px;
+}

index/src/app/view/admin/admin.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AdminComponent } from './admin.component';
+
+describe('AdminComponent', () => {
+  let component: AdminComponent;
+  let fixture: ComponentFixture<AdminComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ AdminComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AdminComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

index/src/app/view/admin/admin.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-admin',
+  templateUrl: './admin.component.html',
+  styleUrls: ['./admin.component.less']
+})
+export class AdminComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

index/src/app/view/admin/admin.module.ts

@@ -11,6 +11,7 @@ import {AdminUpdateComponent} from './admin-update/admin-update.component';
 import {AdminUserComponent} from './admin-user/admin-user.component';
 import {AdminUserinfoComponent} from './admin-userinfo/admin-userinfo.component';
 import {AdminVisitorComponent} from './admin-visitor/admin-visitor.component';
+import { AdminComponent } from './admin.component';
 
 
 @NgModule({
@@ -24,7 +25,8 @@ import {AdminVisitorComponent} from './admin-visitor/admin-visitor.component';
         AdminUpdateComponent,
         AdminUserComponent,
         AdminUserinfoComponent,
-        AdminVisitorComponent
+        AdminVisitorComponent,
+        AdminComponent
     ],
     imports: [
         CommonModule,

index/src/app/view/admin/auth.guard.spec.ts

@@ -0,0 +1,16 @@
+import {TestBed} from '@angular/core/testing';
+
+import {AuthGuard} from './auth.guard';
+
+describe('AuthGuard', () => {
+    let guard: AuthGuard;
+
+    beforeEach(() => {
+        TestBed.configureTestingModule({});
+        guard = TestBed.inject(AuthGuard);
+    });
+
+    it('should be created', () => {
+        expect(guard).toBeTruthy();
+    });
+});

index/src/app/view/admin/auth.guard.ts

@@ -0,0 +1,33 @@
+import {Injectable} from '@angular/core';
+import {CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree} from '@angular/router';
+import {Observable} from 'rxjs';
+import {User} from '../../class/User';
+
+@Injectable({
+    providedIn: 'root'
+})
+export class AuthGuard implements CanActivate {
+
+    constructor() {
+    }
+
+    userInfo: User;
+
+    canActivate(
+        next: ActivatedRouteSnapshot,
+        state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
+        const path = state.url.indexOf('?') > 0 ? state.url.substr(0, state.url.indexOf('?')) : state.url;
+        switch (path) {
+            case '/admin/article':
+            case '/admin/category':
+            case '/admin/link':
+            case '/admin/tag':
+            case '/admin/update':
+            case '/admin/user':
+            case '/admin/visitor':
+                if (!this.userInfo || this.userInfo.role !== 'admin') return false;
+        }
+        return true;
+    }
+
+}