Angularjs 如何在Angular ui路由器中重定向到404页面

嗨，我在使用angular ui路由器实现404页面时遇到问题 脚本 当用户在url中键入应用程序中不存在的内容时，我必须显示404页面未找到页面

我试过的

app.js

var myapp = angular.module('myapp', ['ui.router']);

myapp.config(function($stateProvider, $urlRouterProvider) {

    $urlRouterProvider.otherwise('/xxx/xxxoverview');

    $stateProvider.state('xxx', {
        url:'/xxx',
        templateUrl :'partials/xxx/xxxOverview.html',
        controller:'xxxAccordionCtrl'
    })
     .state('404', {
        url:'/404',
        templateUrl :'404.html'

    });

我的实际设计

我得到以下回应

我期待着

---

您有这样的index.html吗

<nav>You navigation</nav>
<ui-view> </ui-view>

---

您可以将您的

导航

放在

模板URL:'partials/xxx/xxxOverview.html'

中，以获得您想要的内容，从而更好地编写布局

您当前的布局是：

 <div>
     .. some layout code here 
     <div> navigation here </div>
     <div ui-view></div>
     ..some more layout
 </div>

.. 这里有一些布局代码
在此导航
…更多的布局

为了得到想要的结果，您必须使用嵌套的ui视图

 <div>
       .. outer layout
       <div ui-view> 
             .. inner layout
             <div> navigation here </div>
             <div ui-view></div>
             .. inner layout cont. 
       </div>
        .. outer layout cont. 
</div>

.. 外部布局
.. 内部布局
在此导航
.. 内部布局（续）。
.. 外部布局（续）。

并相应地更改路由

如果你给我几分钟的时间，我会为你准备一份扑克牌

这对你来说是一件好事：

这是我做的代码的分解

$stateProvider
     .state('layout', {
       template: 'my navigation <div ui-view></div>'

     } )
     .state('layout.page', {
       url: '/page',
       template: 'this is my content go see a missing page <a href="#/404">missing page link</a>'
     })
     .state('404', {
       url:'/404',
       template: '404!!! page is missing'
     });

$stateProvider
.state（'布局'{
模板：“我的导航”
} )
.state（'layout.page'{
url:“/页”，
模板：“这是我的内容，请查看缺少的页面”
})
.州（'404'{
url:“/404”，
模板：“404！！！缺少页面”
});

正如你们所看到的，我有一个“抽象”状态，叫做“布局”，它基本上定义了模板，但就是这样！没有url，没有控制器，什么都没有

我在模板中添加导航，然后添加另一个ui视图。-注意我的

index.html

上已经有了一个ui视图。除此之外，

index.html

可以是空的。我在那里添加了

hello

，这样你就有了一个参考点

然后，我的页面在布局中处于嵌套状态。请参见状态

布局。页面
。这就是angular ui路由器的优势所在。
这样，您可以为网站的不同部分设置不同的布局。
因此，我的页面仅通过嵌套状态来使用布局

然后我有一个不同的状态，我称之为404。
因为它不是从布局继承的，所以它没有导航
 @RavindharKonka-添加了plunker+解释。如果你有任何问题，请让我知道。我已经通过了plunker，但我如何才能有效的网址。在plunker你给了链接导航404页，但如果用户输入无效的用户，那么我想404页你能帮助吗me@RavindharKonka-这是一个不同的问题，您可以在：：Thank@guy mograbi you is找到解决方案解决我的问题，我支持（投票）这个答案：“@ RavindharKonka请考虑将我的答案标记为解决方案（按复选标记），这样它不会在搜索中显示为“打开”。