angularjs - 使用抽象状态的目的是什么？

Question

我正在编写我的教程 AngularUI 项目。
我阅读了所有关于状态、嵌套状态和抽象状态的内容。
问题是我不明白为什么以及何时应该使用抽象状态？

Answer 1

Abstract state does mean the state that you wrote can't be accessible directly. Abstract states still need their own for their children to plug into.

当我们加载它的子状态时，它会被调用。您可以使用抽象状态来定义页面的一些初始模式，假设您可以以任何社交媒体网站为例，您想在其中显示用户个人资料和社交页面。为此，您可以拥有一个 abstract状态，它将有 url: "" & 有你的页面的基本布局。点赞 header , content & footer命名 View 。 header & footer命名 View 将由抽象状态填充，然后 subview 将定义内容取决于显示的模块。 /profile将显示 userProfile.html & /social将显示用户的社交页面 social.html .

配置

app.config(function($stateProvider){
  $stateProvider.state("app":
  {
    url: "", //you can have the default url here..that will shown before child state url
    abstract: true,
    views: {
       '': {
          templateUrl: 'layout.html',
          controller: 'mainCtrl'
       },
       'header': {
          templateUrl: 'header.html'
       },
       'footer': {
          templateUrl: 'footer.html'
       }
    },
    resolve: {
       getUserAuthData: function(userService){
           return userService.getUserData();
       }
    }

  })
  .state("app.profile": {
      'content@app': {
          templateUrl: 'profile.html',
          controller: 'profileController'
      }
  })
  .state("app.social": {
      'content@app': {
          templateUrl: 'social.html',
          controller: 'socialController'
      }
  })
})

abstract 的其他主要功能您是否可以对其进行共同解决，通过数据提供继承的自定义数据以供子状态或事件监听器使用。您也可以拥有 OnEnter & OnExit在加载之前确保一切 state & 离开 state 时