$routeProvider和$stateProvider有什么区别？

两者都执行与在SPA（单页应用程序）中用于路由目的相同的工作。

1. 角度路由 - 每个$routeProvider文档

控制器和视图的 URL（HTML 部分）。它监视$location.url（），并尝试将路径映射到现有路由定义。

断续器

<div ng-view></div>

上面的标记将从您在（配置阶段）中提到的条件呈现模板$routeProvider.when().config

限制：-

• 该页面只能包含单个页面ng-view
• 如果 SPA 在页面上有多个小组件，并且您希望根据某些条件呈现这些组件，则会失败。（为了实现这一点，我们需要使用像， ， ， 这样的指令，这在 SPA 中使用它们看起来很糟糕）$routeProviderng-includeng-switchng-ifng-show
• 您不能像父路由和子路由那样关联。
• 您无法根据 url 模式显示和隐藏视图的一部分。

2. ui-router - 每个$stateProvider文档

AngularUI Router是AngularJS的路由框架，它允许您将接口的各个部分组织到状态机中。UI 路由器是围绕状态组织的，状态可以选择附加路由以及其他行为。

多个和命名视图

另一个很棒的功能是能够在模板中具有多个ui视图。

虽然多个并行视图是一项强大的功能，但您通常能够通过嵌套 s 并将这些视图与嵌套状态配对来更有效地管理接口。view

断续器

<div ui-view>
    <div ui-view='header'></div>
    <div ui-view='content'></div>
    <div ui-view='footer'></div>
</div>

的大部分功能是它可以管理嵌套状态和视图。ui-router

优点

• 您可以在单个页面上有多个ui-view
• 各种视图可以相互嵌套，并通过在路由阶段定义状态来维护。
• 我们可以在这里建立子项和父项关系，就像在状态中继承一样，你也可以定义同级状态。
• 您可以通过使用带有状态名称的绝对路由来更改状态。ui-view="some"@
• 执行相对路由的另一种方法是仅使用 更改 。这将取代 而不是检查它是否嵌套。@ui-view="some"ui-view
• 在这里，您可以使用在状态中提到的基础上动态创建URL，也可以在格式中给出状态参数。ui-srefhrefURLjson

欲了解更多信息，角度ui路由器

为了更好地灵活地使用带有状态的各种嵌套视图，我宁愿您选择ui-router

Angular自己的ng-Router在路由时考虑了，UI路由器除了考虑URL之外。URLsstates

状态绑定到命名视图、嵌套视图和并行视图，使您能够有力地管理应用程序的接口。

在ng路由器中，在通过标记提供链接时必须非常小心URL，而在UI路由器中，您只需要记住。您提供的链接类似于 .请注意，即使您在UI路由器中使用，就像在ng路由器中一样，它仍然有效。<a href="">state<a ui-sref=""><a href="">

因此，即使您决定有一天更改URL，您的URL也将保持不变，您只需要在.state.config

虽然ngRouter可用于制作简单的应用程序，但UI-Router使复杂应用程序的开发变得更加容易。这是它的维基。