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

Question

我正在研究AngularUI项目。我阅读了有关状态，嵌套状态和抽象状态的所有信息。问题是我不明白为什么以及何时应该使用抽象状态？

Answer 1

抽象状态确实意味着您编写的状态不能直接访问。抽象状态仍然需要自己的子项才能插入。

当我们加载其孩子的状态时，它将被调用。您可以使用抽象状态来定义页面的某些初始模式，假设您可以举一个任何社交媒体网站的示例，您希望在该网站上显示用户个人资料和社交页面。为此，您可以具有一种abstract状态，该状态将具有url: ""＆具有页面的基本布局。像header，content及footer命名的视图。header＆footer命名视图将由抽象状态填充，然后child将定义内容取决于所显示的模块。/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