我正在研究AngularUI项目。我阅读了有关状态,嵌套状态和抽象状态的所有信息。问题是我不明白为什么以及何时应该使用抽象状态?
抽象状态确实意味着不能直接访问您编写的状态。抽象状态仍然需要自己的子项才能插入。
当我们加载其子状态时,它将被调用。您可以使用抽象状态来定义页面的某些初始模式,假设您可以举一个任何社交媒体网站的示例,您希望在该网站上显示用户个人资料和社交页面。为此,您可以具有一种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
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句