$ routeProvider和$ stateProvider有什么区别？

两者的功能与SPA（单页应用程序）中用于路由目的的功能相同。

1.角路由-每个[$

routeProvider文档](https://docs.angularjs.org/api/ngRoute/provider/$routeProvider)

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

的HTML

<div ng-view></div>

上面的标签将根据

$routeProvider.when()

.config

局限性

• 该页面只能包含一个

  ng-view

  页面
• 如果您的SPA在某些情况下要在页面上显示多个小组件，则

  $routeProvider

  失败。（实现这一目标，我们需要使用指令一样

  ng-include

  ，

  ng-switch

  ，

  ng-if

  ，

  ng-show

  ，这看起来不错，让他们在SPA）
• 您不能在两条路线之间建立联系，例如父子关系。
• 您无法基于URL模式显示和隐藏视图的一部分。

2. ui- [router-](http://angular-ui.github.io/ui-

router/site/#/api/ui.router.state.$stateProvider)每个$
stateProvider文档

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

多个视图和命名视图

另一个重要功能是能够在模板中具有多个ui视图。

虽然多个并行视图是一个强大的功能，但是您通常可以通过嵌套

view

的HTML

<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"

  仅通过使用

  @

  带有状态名称的绝对路由来更改状态。
• 进行相对路由的另一种方法是仅

  @

  使用change

  ui-view="some"

  。这将代替

  ui-view

  而不是检查是否嵌套。
• 在这里，您可以用来根据状态中提到的内容动态

  ui-sref

  创建

  href

  URL

  URL

  ，也可以使用

  json

  格式指定状态参数。

有关更多信息Angular ui-router

为了更好地处理带有状态的各种嵌套视图，我希望您能使用

ui-router