AngularJS $ routeProvider nie może załadować bezpośrednio do częściowego - javascript, angularjs, apache, angularjs-routing

W tej chwili używam $ routeProvider do dynamicznego ładowania sekcji strony w następujący sposób:

$routeProvider
.when("/", {
templateUrl: "/pages/home.html",
controller: "mainController"
})
.when("/our-business", {
templateUrl: "/pages/our-business.html",
controller: "businessController",
css: "css/_business.css"
})
.when("/solutions", {
templateUrl: "/pages/solutions.html",
controller: "solutionsController"
});

Obecnie, jeśli przejdę bezpośrednio do indeksu (localhost), a następnie wybiorę „Nasza firma” z menu nawigacyjnego, wówczas Angular zajmie się żądaniem lokalizacji, a strona ładuje się poprawnie, a adres URL zmienia się na localhost / nasz-biznes. Po ponownym załadowaniu lub bezpośrednim otwarciu tego adresu URL pojawia się błąd 404 - prawdopodobnie dlatego, że Apache próbuje otworzyć nasz-business.html, który nie istnieje. Jeśli otworzę localhost / # / our-business następnie indeks jest ładowany, a Angular obsługujeprośba. Problem, który dostałem, polega na tym, że jest to witryna publiczna, więc jeśli użytkownik skopiuje i wklei adres URL lub udostępni go pocztą e-mail, otrzyma błąd 404.

Czy jest jakiś sposób, aby Apache przepisał adresy URL w celu przetworzenia ich za pośrednictwem indeksu i AngularJS, abyśmy mogli zachować styl nieszyfrowy, ale nadal mieć funkcjonalne adresy URL?

Odpowiedzi:

Jak powiedział Kailash, możesz ustawić locationProvider na tryb HTML5

$locationProvider.html5Mode(true)

podczas ładowania aplikacji kątowej.

Następnie musisz powiedzieć swojemu serwerowi Apache, aby wysłał plik index.html (punkt wejścia Twojej aplikacji na jednej stronie) dla dowolnego żądanego adresu URL.

Router kątowy będzie wtedy obsługiwał właściwą trasę

Nie. Zmiana adresu URL bez skrótu powoduje ponowne załadowanie całej strony.

Cały sens tego $routeProvider polega na zbudowaniu aplikacji jednostronicowej z wieloma widokami.

Zasadniczo posiadanie # w adresie URL to jedyny sposób, aby to zrobić. Zmiany w hashu adresu URL nie powodują przeładowania strony i pozwalają Angularowi załadować odpowiednie widoki.