Question

我正在研究我的AngularUI项目教程。我阅读了有关状态，嵌套状态和抽象状态的所有内容。问题是我无法理解为什么以及何时应该使用抽象状态？

Answer 1

抽象状态确实意味着您编写的状态无法访问直。抽象的状态仍然需要他们自己的孩子插入。

当我们加载其子状态时会调用它。您可以使用抽象状态来定义页面的一些初始模式，假设您可以举出任何社交媒体网站的示例，您希望在该网站上显示用户个人资料和社交页面。为此，您可以拥有一个abstract州，其中包含url: ""＆amp;有你的页面的基本布局。与header，content和{ footer个命名视图。 header＆amp; footer命名视图将被抽象状态＆amp;然后，子将定义内容的内容取决于显示哪个模块。 /profile会显示userProfile.html＆amp; /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＆amp;关于加载OnExit＆amp;之前确定内容的state离开state

Answer 2

如果你不想要一个可以被击中的状态，那么你可以将它变成一个抽象的状态。实施例

\A
\A.B
\A.B.C

如果您不希望用户只是转到\A，则应将其设为abstract。

Answer 3

基本上，抽象状态可以帮助您将不同状态的常用功能移动到父抽象状态。

典型示例是处理用户名，本地化设置和元数据加载的状态。您不希望用户重定向到只会加载该状态的状态。您希望在重定向到每个状态时始终加载

for (int a = 1; a <= 10; a++) { Console.WriteLine($"2x{a} = {a << 1}"); }会是抽象的 /session， /session/main不会。通过依赖关系，会在转到/session/detail和main状态时加载会话数据，但您不希望用户转到detail状态。

Answer 4

抽象状态

在某些情况下，我们需要在几个州提供一些常见信息。为此，UI-Router提供了指定抽象状态的可能性。抽象状态可以具有子状态但是它们本身不能被激活而不能转换为。当其子状态之一被激活时，隐式激活抽象状态。这在以下情况下很有用我们需要在所有子状态网址前面添加一个网址我们需要插入一个模板，其中包含子状态将填充的ui-view 我们需要提供已解析的依赖项（通过解析）以供子状态使用我们需要提供继承的自定义状态数据，以供子状态或事件使用定义抽象状态，指定状态配置对象中的抽象键设置为true。

$stateProvider

.state('home', {

    abstract: true,

    templateURL: 'home.html'

})

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

4 个答案: