Как использовать AngularJS UI-router захватывать этот URL с необязательным параметром?

0

Я использую url-маршрутизатор AngularJD для захвата моего URL-адреса и отправки двух параметров с этого URL-адреса на мой контроллер. Вот мои требования:

  • Первым параметром является обязательное целое число (id)
  • Второй параметр - необязательная строка (slug)
  • Два параметра разделяются символом /
  • Я хочу, чтобы он игнорировал любые одиночные трейлинг /

В настоящее время я делаю это:

$stateProvider.state('mystate',
  {
    url: '/mystate/{id:int}{slug:(?:/[^/]+)?}',
    params: {
      slug: {value: null}
    },
    templateUrl: 'partials/mystate.html',
    controller: function($stateParams) {
      console.log('$stateParams.id=',$stateParams.id, ' $stateParams.slug=',$stateParams.slug);
    }
  }

Для URL: mystate/1 Это правильно фиксирует:

$stateParams.id=1, $stateParams.slug=null

Для URL: mystate/1/myslug Это фиксирует неправильное значение для slug:

$stateParams.id=1, $stateParams.slug=/asdad

Для URL: mystate/1/ Это ничего не mystate/1/.

Для URL: mystate/1/myslug/ Это ничего не захватывает.

Как я могу написать это так, чтобы он правильно фиксировал все четыре вышеупомянутых URL-адреса, но не передал ни один из / на контроллер?

Теги:
angular-ui-router
angularjs-routing

1 ответ

2

Для необязательной конечной косой черты вам нужно установить строгий режим в false в блоке конфигурации:

angular.module('yourModule').config(['$urlMatcherFactoryProvider', function($urlMatcherFactoryProvider) {
  $urlMatcherFactoryProvider.strictMode(false);
}]);

Для имеющих дополнительные параметры, там долго обсуждали здесь. В конце они предлагают использовать squash:

$stateProvider.state('mystate',
{
  url: '/mystate/{id:int}/:slug',
  params: {
    slug: {value: null, squash: true}
  },
  templateUrl: 'partials/mystate.html',
  controller: ['$stateParams', function($stateParams) {
    console.log('$stateParams.id=',$stateParams.id, ' $stateParams.slug=',$stateParams.slug);
  }]
}

squash имеет хорошую документацию, если вы установите значение true, он не укажет параметр из URL, если он имеет значение по умолчанию.

  • 0
    Спасибо!! Где я могу вставить строку для $urlMatcherFactoryProvider ? Когда я вставил его прямо перед строкой $ stateProvider, я получил: Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to: ReferenceError: $urlMatcherFactoryProvider is not defined
  • 1
    Сначала вам нужно будет вставить его в вашу конфигурационную функцию
Показать ещё 4 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню