Angular base href 没有出现在 URL 中

标签 angular routing href angular-routing

我正在尝试将我的 Angular 应用程序部署到生产环境中,该生产环境在 url 中有一个额外的位置步骤,例如www.production-server.com/name-of-my-app 附加到它。

当我通过 localhost:4200 上的 angular cli 运行它并通过页面重定向时,我的应用程序工作得很好,例如从 localhost:4200/page1 到 localhost:4200/page2。

但是当我尝试设置基本 href 时

 "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "baseHref" : "/name-of-my-app/",
            "outputPath": "dist",
            "index": "src/index.html",
...

并像这样配置我的路线:

const routes: Routes = [
  Route.withShell([
    {path: '', redirectTo: '/sredstva', pathMatch: 'full'},
    {path: 'sredstva', component: OsebnasredstvaComponent, data: {title: extract('Osebna sredstva')}}
  ])
];


/**
 * Provides helper methods to create routes.
 */
export class Route {

  /**
   * Creates routes using the shell component and authentication.
   * @param routes The routes to add.
   * @return {Route} The new route using shell as the base.
   */
  static withShell(routes: Routes): ngRoute {
    return {
      path: '',
      component: ShellComponent,
      children: routes,
      canActivate: [AuthenticationGuard],
      // Reuse ShellComponent instance when navigating between child views
      data: { reuse: true }
    };
  }

}

应用程序仍然将 localhost:4200/page1 路由到页面 localhost:4200/page2 而不是 localhost:4200/name-of-my-app/page1 和 localhost:4200/name-of-my-app/page2。这是为什么?

编辑:我想补充一点,当我检查页面时,基本 href 正确显示。但它不会显示在 URL 中。

As seen on this picture

最佳答案

尝试运行

$ ng build --prod --base-href="add/your/base/url/here"

关于Angular base href 没有出现在 URL 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57589564/

相关文章:

Angular 7+,从父组件调用子组件的方法好吗?

Angular:我可以在编译时强制设置输入绑定(bind)吗?

javascript - 根据用户在 Angular 中的选择动态替换主要组件内容

css - 内联链接的不同样式

jquery动态改变svg图像xlink :href

javascript - 如何使用 Javascript 替换特定的 href 链接?

angular - 在 Angular2 上创建小项目,然后将它们作为一个项目加入

ruby-on-rails - 如何在 Rails 4 中为 AngularJS 更正设置根路由?

php - ArgumentCountError函数0传递的参数太少,而Laravel中恰好期望1

reactjs - NavLink 需要在两条路线上处于事件状态 React-Router