Angular 1.6 - use state to redirect from wrong url to 404 page

Question

How to redirect user from wrong url to 404 page in Angular 1.6 using $state?

.state('404', {
    url: '/404',
    template: '<page-404></page-404>',
    ncyBreadcrumb: {
      label: '404'
    },
    data: {requiredLogin: false}
  });

Answer 1

The otherwise() rule is only invoked when no other route matches. Catch the $stateChangeError event. link

The easy implementation is:

$rootScope.$on('$stateChangeError', function(event) {
  $state.go('404');
});

Or

$urlRouterProvider.otherwise('/page-not-found');

.state('error', {
  url: "/page-not-found",
  templateUrl: "templates/error.html",
  controller: "errorController"
})