Как правильно маршрутизировать для SPA с использованием углового 1,5?

Question

Я новичок в угловой. Я создаю блог для показа моего профиля. На моем сайте, у меня есть несколько компонент, и мой app.module имеет конфигурацию для маршрутизации, как показано на рисунке:

app.config(function($locationProvider, $routeProvider){ 
    $locationProvider.html5Mode({ 
    enabled:true, 
    requireBase: false 
    }) 

    $routeProvider. 
    when("/", { 
     template: "<research-overview></research-overview>" 
    }). 
    when("/research-interests", { 
     template: "<research-interests></research-interests>" 
    }). 
    otherwise({ 
     redirectTo: "/" 
    }) 
}); 

Вот пример моего компонента:

angular.module('researchOverview', []) 
    .component('researchOverview', { 
    templateUrl: '/templates/research-overview.html', 
}); 

Я попытался локально запустите сервер, используя python -m SimpleHttpServer , чтобы я мог получить доступ к своему локальному сайту с помощью браузера до localhost:8000. Когда я нажимаю ссылку с моей домашней страницы, страница правильно загружена. Тем не менее, когда я изначально обращаюсь к своему сайту с использованием разных URL-адресов (например, localhost:8000/testing) Угловой маршрут не работает должным образом. я получаю эту ошибку вместо

Как настроить маршрутизатор так, что эти адреса могут быть перенаправлены на моей странице?

Answer 1

Учитывая, что у вас включен режим html5, я думаю, вам, возможно, потребуется настроить сервер, чтобы независимо от пути он вернул ваш файл index.html.

Например, когда ваш сервер получает запрос на ресурс в localhost: 8000/testing, он вернет index.html.

Из документации AngularJS:

Использование этого режима требует перезаписи URL на стороне сервера, в основном вы должны переписать все ссылки на точку входа приложения (например, index.html). Требование к тегу также важно для этого случая , так как он позволяет Угловому различать часть URL-адреса , которая является базой приложения, и путь, который должен обрабатываться приложением .