angularjs - Prepend optional attribute in angular ui-router URL

Question

Is there a way to have an optional attribute at the beginning of the url in ui-router? If so, how?

I want to achieve sth like this:

.state('events',{
    url: '(/city:)?/events/:id'
    ...
})

So "city" would be optional.

Thank you for any input whatsoever.

Answer 1

It's probably bad practice to have two separate routes point to the same state, but nothing is keeping you from creating two different states that use the same resolutions/controller/template.

$stateProvider
.state('state1', {
  url: "/:city/events/:id",
  templateUrl: "partials/events.html",
  controller: eventsCtrl
})
.state('state2', {
  url: "/events/:id",
  templateUrl: "partials/events.html",
  controller: eventsCtrl
});

function eventsCtrl($scope){
  // shared controller
}

Again, this is probably bad practice but I can't think of a better solution