Блог

Главная - Вопросы по программированию - Angular устанавливает базовую ссылку href для разных статических целевых страниц

Angular устанавливает базовую ссылку href для разных статических целевых страниц

#angular

#angular

Вопрос:

Моя структура папок:

  /LandingPage1/
                css/
                images/
                page1.html
                page2.html
                index.html
 /LandingPage2/
                css/
                images/
                page1.html
                page2.html
                index.html
 /LandingPage3/
                css/
                images/
                page1.html
                page2.html
                index.html
 index.html

Для /index.html Я добавил:

  <base href="/">
<script>
  (function() {
    window['_app_base'] = '/'   window.location.pathname.split('/')[1];
  })();
</script>

<body>
<app-root></app-root>
</body>

Также в angular.json позиция этого index.html было изменено.

И в app.module:

   providers: [
    { provide: APP_BASE_HREF, useValue: window['_app_base'] || '/' },
  ]

Я хотел бы:

когда я открою в браузере localhost:4200/LandingPage1 <- Я получу доступ к этим страницам1, страница2 и т.д.

Byt, когда я изменил на localhost:4200/LandingPage2 -> Я смогу открыть /LandingPage2/page1.html

Ответ №1:

Для достижения этого добавьте весь ваш статический путь в раздел ресурсов в файле angular.json

 "assets": [
"src/LandingPage1",
"src/LandingPage2",
"src/LandingPage3",
]

После внесения изменений снова запустите команду ng serve, после чего вы сможете получить доступ к статическим страницам внутри этих папок.

Пожалуйста, перейдите по ссылке для получения полного руководства:нажмите здесь

Комментарии:

1. Спасибо, я добавил ее и получил ошибку: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'page1.html'

2. другой простой способ — переместить вашу статическую страницу внутрь папки assets, тогда вы сможете получить доступ ко всем вашим страницам, но в этом случае URL будет localhost:4200/assets/LandingPage2/page1.html

3. Спасибо. Но как мы можем это сделать без /assets / path?

4. Я изменил свой ответ, пожалуйста, следуйте этому, чтобы сделать это без пути к ресурсам