刷新时不加载Angular2页面

时间:2016-11-01 19:03:05

标签: javascript angular routing load

我有问题。 当我在锚点上点击我的索引时

<a href ="/month/1">Month</a> 

我的应用程序没有加载,但同时当我点击我的组件中的锚点

<a routerLink="/month/1"> Month</a> 

我的应用加载了该页面。这是我的路线。

{ path: 'month/:id', component: MonthComponent },

当我刷新页面时从组件加载页面时,它会产生与我来自索引时相同的错误。在我在网址中添加参数之前,我没有遇到此问题。我试图在我的索引中使用routerLink,但它甚至没有加载url。

2 个答案:

答案 0 :(得分:0)

很可能是由于服务器端路由。使用链接href,浏览器向托管应用程序的服务器发出请求。如果您尚未将Web服务器设置为将所需路径路由到单页应用程序,则会在系统中查找存储在where.com/month/1

的服务器上的内容

如果您使用主机类型更新问题(例如,ExpressJS,IIS等),我可以提供一个具体示例。

使用IIS URL重写的示例(web.config)

<rewrite>
  <rules>
      <rule name="Redirect To Index" stopProcessing="true">
          <match url="(.*)" />
          <conditions>
              <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
          </conditions>
          <action type="Rewrite" url="index.html" />
      </rule>
  </rules>
</rewrite>

答案 1 :(得分:0)

这是由于服务器被调用(服务器端路由)。您如何解决问题取决于您如何为您提供服务。只是Html和JS(来自转换后的代码)然后上面的答案与web.config的调整将工作。如果您使用MVC来提供应用程序,那么您将需要调整路由以将请求传递回客户端。

.Net Core示例:

        app.UseMvc(routes =>
        {
            routes.MapRoute(
                name: "default",
                template: "{controller=Home}/{action=Index}/{id?}");

            routes.MapSpaFallbackRoute(
                name: "spa-fallback",
                defaults: new { controller = "Home", action = "Index" });
        });