0

我正在尝试在我的 angular4 应用程序中实现简单的路由,但是深层链接不起作用。

例如,我有一个 About 组件和一个 Homepage (todos) 组件,我的 app.routing.ts 文件如下:

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

import { TodosComponent } from './todos/todos.component';
import { AboutComponent } from './about/about.component';
import { CallbackComponent } from './callback/callback.component';

const appRoutes: Routes = [

  {
    path: '',
    component: TodosComponent
  },
  {
    path: 'about',
    component: AboutComponent
  },
  {
    path: 'callback',
    component: CallbackComponent
  }

];

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

现在,当我从 routerLink 中单击应用程序时,导航适用于这些组件,但如果我直接在浏览器中键入 URL,我会得到 404..

这打破了我的身份验证源的回调:(

我的 app.module.ts 文件已导入路由器文件,但这仍然不起作用..我如何在此处启用深度链接?

4

3 回答 3

0

如果你有一条没有子节点的空路径'',你应该使用pathMatch: 'full'

  {
    path: '',
    component: TodosComponent,
    pathMatch: 'full'
  },

否则每条路径都将匹配,路由器将搜索(不存在的)子路由与路径的其余部分匹配。

如评论中所述,如果您使用PathLocationStrategy(默认),则需要配置您的服务器以支持它。

您可以通过切换到来检查服务器是否是罪魁祸首HashLocationStrategy

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes, {useHash: true});

#这些路线看起来不同,所以当您直接输入它们时,不要指望旧路线(没有)可以工作。

于 2017-10-25T05:58:40.077 回答
0

我认为您需要重写 URL。在 IIS 中,它会是这样的:

<system.webServer>
      <rewrite>
        <rules>
            <rule name="Angular" stopProcessing="true">
                <match url=".*" />
                <conditions logicalGrouping="MatchAll">
                    <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                    <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                </conditions>
                <action type="Rewrite" url="/" />
            </rule>
        </rules>
        </rewrite>
    </system.webServer>
于 2019-08-23T17:33:55.803 回答
0

我希望您可能已经解决了您的问题。

这个解决方案就是我使用的 HashLocationStrategy。

RouterModule.forRoot(appRoutes, {useHash: true});

这导致所有应用程序 url 都是 index.html,后跟“#”,然后是路由信息。

由于您总是要访问 index.html,因此无论路由如何,您都不会得到任何有效 URL 的 404。

于 2019-02-18T05:56:14.663 回答