Angular UIRouter does not change with child state

Question

I use Angular UIRouter and set the following states:

$stateProvider.state('forgot-password', {
        url: '/forgot-password',
        component: 'forgotPassword'
})
.state('forgot-password.reset', {
        url: '/:token',
        component: 'forgotPasswordReset'
});

When I go to /forgot-password, I get the correct view, but when I go to /forgot-password/abc, I still get a link to forgotPassword. How to make the router send me state forgot-password.reset?

Answer 1

There are several different reasons why this can happen. Above my head:

• You do not have a directive ui-viewin the template for your component forgotPassword.
• One or both components are not registered (but you should see errors in the console, if so).
• URL-, .
• . , redirectTo - , .

UI Router , , , . , , - .