使用抽象状态的目的是什么？ [英] what is the purpose of use abstract state?

问题描述

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

I am working on my tutorial AngularUI project. I read all about states, nested states and abstract states. The problem is that I can't understand why and when I should use abstract state?  

推荐答案

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

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.

在加载其子状态时会被调用。您可以使用抽象状态来定义页面的某些初始模式，假设您可以举一个任何社交媒体网站的示例，并在其中显示用户个人资料&社交页面。为此，您可以具有一个抽象状态，该状态将具有 url： &具有页面的基本布局。像标头，内容& 页脚命名视图。 标题& 页脚命名视图将由抽象状态&然后孩子将根据显示的模块定义内容。 /个人资料将显示 userProfile.html & / social 将显示用户 social.html 的社交页面。

It gets called when we load its child's state. You can use abstract state to define some initial pattern of your page, suppose you can take an example of Any social media site, where you wanted to show user profile & social page. For that you could have one abstract state, which will have url: "" & have basic layout of your page. Like header, content & footer named views. header & footer named view will be filled up by the abstract state & then child will define the what the content is depends on which module is displayed. /profile will show the userProfile.html & /social will show the social page of an user social.html.

Config

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'
      }
  })
})

摘要是您可以解决的常见问题，它可以通过子状态或事件侦听器使用的数据提供继承的自定义数据。您也可以使用 OnEnter & OnExit ，以确保在加载状态和&而从状态

Other main feature of abstract is you can have common resolve on it, provide inherited custom data via data for use by child states or an event listener. Also you can have OnEnter & OnExit on it to making sure things before loading state & while leaving from state

这篇关于使用抽象状态的目的是什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！