Angular-UI-Router перестает работать, когда пространство имен объявляется перед параметрами id

Я делаю простой раздел блога на своем веб-сайте, поэтому я хочу иметь пространство имен, называемое сообщениями, которое динамически ссылается на шаблон сообщения. У каждого из этих сообщений будет свой собственный шаблон (например, posts/some_post.html), поскольку они слишком разные, чтобы просто использовать данные json для заполнения общего шаблона.

Я хочу иметь пространство имен, которое позволяет мне создавать ссылки на каждое сообщение, чтобы я мог публиковать в рабочей среде: mysite/posts/my_new_post. Однако добавление сообщений в URL-адрес .state приводит к невозможности создания экземпляра ошибки модуля.

Это фрагмент рабочего кода:

.config(["$urlRouterProvider", "$stateProvider","$locationProvider", function ($urlRouterProvider, $stateProvider,$locationProvider){

$urlRouterProvider.otherwise('/');

$locationProvider.html5Mode(true);

$stateProvider

  .state('posts', {
    url: '/:postID',
    templateUrl : function($stateParams){
      return 'templates/posts/' + $stateParams.postID + '.html';
    },
  });


}]);

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

li><a ui-sref="posts({postID: 'blog2'})">blog 2</a></li>

URI становится веб-сайтом/блогом2, а с веб-сайта/дома я могу ссылаться на URI.

ОДНАКО, если я попытаюсь добавить пространство имен, я получу ошибку:

.state('posts', {
    url: '/posts/:postID',  // note i added posts before the id
    templateUrl : function($stateParams){
      return 'templates/posts/' + $stateParams.postID + '.html';
 },

Ссылка будет работать в первый раз и приведет меня на нужную страницу, однако, если я наберу шаблон URI mysite/posts/blog1, я получу: Uncaught Error: [$injector:modulerr] error, и это странное: Uncaught SyntaxError: Неожиданный маркер <

Почему-то не загружается angular, у кого-нибудь есть идеи?


javascript angularjs angular-ui-router angular-ui angular-ui-router-extras
person vonnklaus    schedule 06.02.2015    source источник
comment
Вам нужна некоторая форма переписывания URL для режима HTML5 для обработки начальной страницы. . У вас есть это? Кроме того, какова полная ошибка и местоположение?   -  person Phil    schedule 06.02.2015

Ответы (1)


arrow_upward
0
arrow_downward

Вы используете html5mode, который требует правильной настройки двух вещей:

  • серверная часть - сервер просто должен знать, что некоторые запросы не для сервера.. они виртуальные. Какое-то перенаправление должно произойти. Узнайте, как это сделать здесь: Как настроить сервер для работы с html5Mode
  • клиентская часть - браузер должен понимать, какая часть URL-адреса должна рассматриваться как относительная.

Чтобы ответить на вторую часть, проверьте эти вопросы и ответы или эти вопросы и ответы для рабочего примера/плункера.

Рассказ:

Как правило, мы должны предоставить элементу HTML <base> значение по умолчанию href.

<base href="/" />

Подробнее:

Что оно делает? Что ж, как вы уже поняли, если мы напрямую переходим на сайт: https://domain/index.html - браузер понимает, что относительная часть - это "/".

Но если мы изменим маршрутизацию на /state/:ID - результирующий URL-адрес будет https://domain/state/abc - это нормально, если мы перейдем туда из уже загруженного index.html.

В случае, если мы перейдем непосредственно к domain/state/abc, базовый href может сильно отличаться от необходимого. И вот где <base href=" должен помочь.

Кроме того, документ может помочь:

$locationProvider

Например, мы можем запросить html5mode следующим образом:

$locationProvider.html5Mode({
   enable: true,
   requireBase: false.
});

см. более подробную информацию также здесь

person Radim Köhler    schedule 06.02.2015