首页 > 解决方案 > 路由不起作用我的代码有什么问题

问题描述

我的 app-routing.module.ts 中有这条路线缺少一些东西,因为当我转到此页面时

https://angular-v4-dot-unique-yew-244216.appspot.com/search

我收到错误,但是当我去这里时它可以工作

https://angular-v4-dot-unique-yew-244216.appspot.com

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { SearchBooksComponent } from './search-books/search-books.component';

const routes: Routes = [
  {
    path: '',
    redirectTo: '/search',
    pathMatch: 'full'
  },
  {
    path: 'search',
    component: SearchBooksComponent
  }
];

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

路线有什么问题?

这是我的 app.yaml

runtime: python27
api_version: 1
threadsafe: true
handlers:
- url: /
  static_files: dist/index.html
  upload: dist/index.html
- url: /
  static_dir: dist

标签: angularroutes

解决方案


您应该重定向到search而不是/search

const routes: Routes = [
  {
    path: '',
    redirectTo: 'search',
    pathMatch: 'full'
  },
  {
    path: 'search',
    component: SearchBooksComponent
  }
];

仅当两条路线发生冲突时,路线顺序才重要,例如search**。两条路线都将search匹配,第一个获胜。

您可以像这样使用哈希定位策略。这个问题也解释了路径位置策略。


推荐阅读