Angular 2 routing/navigation

Question

我有 angular 2 ts 应用程序，其中路由定义为：

@RouteConfig([
        { path: '/accounts', name: 'Accounts', component: AccountComponent, useAsDefault: true},
        { path: '/transactions', name: 'Transactions', component: TransactionComponent}
])

当我进入浏览器时：http://localhost/ the url updates with http://localhost/accounts and works as expected, however if I enter http://localhost/accounts it become http://localhost/accounts/accounts 失败。

怎么了？

后端 -ASP.NET 5 是指 index.html 所有未知路径

   app.Use(async (context, next) =>
        {
            await next();

            if (context.Response.StatusCode == 404 && !Path.HasExtension(context.Request.Path.Value))
            {
                context.Request.Path = "/index.html"; 
                await next();
            }
        });

启动部分：

   public void Configure(IApplicationBuilder app)
    {
        app.UseIISPlatformHandler();

        app.Use(async (context, next) =>
        {
            await next();

            if (context.Response.StatusCode == 404 && !Path.HasExtension(context.Request.Path.Value))
            {
                context.Request.Path = "/index.html"; 
                await next();
            }
        });

        app.UseDefaultFiles();
        app.UseStaticFiles();

        app.UseMvc(routes =>
        {
            routes.MapRoute("spa-fallback", "{*anything}", new {controller = "Home", action = "Index"});
        });

    }

Answer 1

已更新

我刚刚注意到您的 angular 路由器配置中的 useAsDefault 选项（我之前没有使用过 angular 2）。我猜这是自动将 /accounts 添加到您的 URL。试试这个配置

public void Configure(IApplicationBuilder app)
{
    app.UseIISPlatformHandler();

    app.Use(async (context, next) =>
    {
        await next();

        if (context.Response.StatusCode == 404 && !Path.HasExtension(context.Request.Path.Value))
        {
            ctx.Response.Redirect("/");
            return;
        }
    });

    app.UseDefaultFiles();
    app.UseStaticFiles();

}

发生的事情是，当您直接在浏览器中输入路由时，它会被 asp.net 路由引擎捕获。你需要做的是让运行时间捕捉这条路线而不是处理它。

app.UseMvc(routes => {
    // maybe you have some other routes.... or not
    routes.Map("spa-fallback", "{*anything}", new {controller = "Home", action="Index"})
});

现在应该发生的是您的初始页面将由服务器呈现，并且任何其他 JS 将运行在路由上。

Answer 2

OF，那里描述的解决方案。

http://blog.nbellocam.me/2016/03/21/routing-angular-2-asp-net-core/

Angular 2 routing/navigation

Angular 2 routing/navigation

angular

asp.net-core

angular2-routing