AngularJS и Spring MVC Project удаляют '#!'

Я работаю над проектом, использующим AngularJS в качестве внешнего интерфейса и Spring MVC в качестве внутреннего. Также я использовал плагин ui-router, Основной URL выглядит как localhost:8080/PROJECT_NAME/#! Для лучшего вида я пытаюсь убрать /#!/ с URL

Мне не удалось получить правильный результат из общего решения из Интернета:

// Insert this into Angularjs module config file
$locationProvider.html5Mode(true);

// Add this into META tag
<base href="/">

После этого все ресурсы рухнули, поэтому я добавил название своего проекта:

<base href="PROJECT_NAME">

Ресурсы правильно выбраны, однако, журнал показывает:

Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:

(anonymous function)    @   angular.js:68
(anonymous function)    @   angular.js:4756
forEach @   angular.js:357
loadModules @   angular.js:4717
createInjector  @   angular.js:4639
doBootstrap @   angular.js:1838
angular.resumeBootstrap @   angular.js:1867
maybeBootstrap  @   hint.js:569

Я не знаю, что делать дальше, может понадобиться твоя помощь, спасибо!


Код маршрутизатора:

app.config(
    function ($stateProvider, $urlRouterProvider){
        $urlRouterProvider.otherwise("/");

        $stateProvider
            .state('index', {
                url: "/",
                templateUrl: "homeview"
            });

        // use the HTML5 History API
        $locationProvider.html5Mode(true);
    }
);

3 ответа

Решение

[1] Установите html5Mode как true, используя приведенный ниже код,

.config(["$locationProvider", function($locationProvider) {
    $locationProvider.hashPrefix('');
    $locationProvider.html5Mode(true);
}])

[2] Установите базовый URL в index.html следующим образом:

<base href="/" />

[3] Создать контроллер для перенаправления URL-адресов в индексный файл

@RequestMapping(value = "/{[path:[^\\.]*}")
public String stalklist() {
    return "forward:/";
}

Тот # уведомляет AngularJS о том, что нет необходимости переходить на сервер для этого URL, вместо этого перейдите на ng-router,

Так что в идеале вы не должны удалять это.

Используйте модуль $locationProvider и установите для html5Mode значение true.

angular.module('StudentView', []).
 config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {

$routeProvider.
  when('/student', {templateUrl: 'partials/studentList.html',   controller: StudentListCtrl}).
  when('/student/:studentId', {templateUrl: 'partials/studentDetail.html', controller: StudentDetailCtrl}).
  otherwise({redirectTo: '/phones'});

$locationProvider.html5Mode(true);

  }]);
Другие вопросы по тегам