Angular ui router default route Video Lecture | Learn and Understand AngularJS : For Beginners - Front-End Programming

this is part 47 of angle J's tutorial in
this video we'll discuss how to set a
default route when using a router in
your angular application let's
understand this with an example at the
moment the problem is that if we try to
navigate to a route that is not
configured in this case ABC is a route
that is not configured so at this point
when I hit enter the first time the app
does not react and nothing happens if I
click in the address bar once again and
then when I hit enter the app reacts and
for this route that is not configured
that is for for slash ABC angular does
not know what partial template to inject
into the layout template and because of
that reason we see a blank layer
template we again have the same problem
if we try to navigate to the root of the
side again for the street URL angular
does not know what partial template to
inject into the layout template we can
solve both of these problems by defining
a default route to define a default
route when using ui-router all you have
to do is inject dollar URL router
provider service into the config
function and then use its otherwise
function passing it the default route
let's look at this in action let's flip
to visual studio let's say we want our
home route to be the default route so
first I'm going to inject dollar URL
router provided service into the config
function and then I'm going to use it
otherwise function and to this otherwise
function I am going to pass the default
route the default route is going to be
for slash home so let's save our changes
and then with ng route module we simply
chain otherwise function and then we use
this redirect to property and set our
default route but when using UI router
we use a different service and that is
dollar URL router provider service so
let's get rid of these lines let's save
our changes and look at this when I
reload this app look at that for the
route it automatically redirects us now
to the default route which is for slash
home look at this when I
delete that when I hit enter it
redirects us to the default route which
is for slash home the same is going to
happen if the user tries to navigate to
a route that's not configured so when I
try to navigate to ABC look at that when
I hit enter it automatically redirects
us to the default route which is for
slash home thank you for listening and
have a great day