title: render 404 page without redirecting in angular js
body: <p>I am using ui.router &amp; ngResource with AngularJS, &amp; my question is :</p>
  
  <p>How do I RENDER 404 without redirecting to it e.g A user typed <a href="http://www.example.com/wrong-page-name" rel="nofollow">http://www.example.com/wrong-page-name</a> , he should just be shown the 404 page, and the URL shouldn't change. </p>
  
  <p>Currently this is how I did it but it redirects</p>
  
  <pre><code>    angular.module('app')
     .run(['$rootScope', '$state', function($rootScope, $state) {
  
              $rootScope.$on('$stateChangeError', function(event, toState, toParams, fromState, fromParams, error) {
                  if(error.status === 404) {
                      $state.go('innerPages.page', {slug:"not-found"});
                  }
              });
      })
      .config(['$stateProvider','$urlRouterProvider', function($stateProvider, $urlRouterProvider) {
  
              $stateProvider.state('innerPages.page', {
                  url: ':slug',
                  views : {
                      'content@':{
                          templateUrl : '...',
                          controller : 'pageController'
                      },
                      'pageHeader@' : {
                          templateUrl : "...",
                          controller : 'pageController'
                      }
                  },
                  resolve:{
                      page: ['pageService', '$stateParams', function (pageService, $stateParams) {
                          return pageService.get({slug:$stateParams.slug}).$promise;
                      }]
                  }
              });
  
          }]);
  </code></pre>
  
  <p>Thanks for Help !</p>