要解决Angular 5在同一组件上的路由不起作用的问题，您可以按照以下步骤进行操作：

1. 确保在app.module.ts文件中正确导入和声明需要使用的组件和路由模块。例如：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule, Routes } from '@angular/router';

import { AppComponent } from './app.component';
import { HomeComponent } from './home.component';
import { AboutComponent } from './about.component';

const appRoutes: Routes = [
  { path: '', component: HomeComponent },
  { path: 'about', component: AboutComponent }
];

@NgModule({
  declarations: [
    AppComponent,
    HomeComponent,
    AboutComponent
  ],
  imports: [
    BrowserModule,
    RouterModule.forRoot(appRoutes)
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

2. 在组件的HTML模板中，使用router-outlet标签来显示路由的内容。例如：

App Component

3. 在组件的.ts文件中，确保正确导入和注入Router模块以及其他相关的依赖项。例如：

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'app-home',
  template: '
Home Component
'
})
export class HomeComponent implements OnInit {

  constructor(private router: Router) { }

  ngOnInit() {
    // 在需要跳转到其他路由的地方使用以下代码
    this.router.navigate(['/about']);
  }

}

请注意，这只是一个简单的示例，您可以根据您的需要进行调整和扩展。确保路由模块和组件正确设置和导入，然后在代码中使用Router模块进行导航。