基本上我正在尝试从root.home状态转换到root.topic.section(带有嵌套剖面视图的主题视图)。视图加载但我的后退按钮和视图标题不会出现。视图标题与root.home中的视图标题保持一致。我不明白,因为当我使用ui-sref改变兄弟状态(没有子状态)时,它会改变标题。
编辑:当我从root.home导航到同级页面root.dbtest时,dbtest在DOM中使用正确的标题创建了一个新的navbar元素,并将home的导航栏设置为'cached' 。但是当我从root.home导航到root.topic.section时,没有创建新的DOM元素,并且home仍然处于活动状态。
编辑2 这是我用来从root.home链接到子状态的'ui-sref'。
<a ui-sref="root.topic.section({topicId: xxx, inStore: false, topicName: xxx, sectionType: SECTION_TYPE.Summary})">link</a>
$stateProvider
.state('root', {
url: '/root',
abstract: true,
templateUrl: 'templates/menu-static.html',
controller: 'MenuCtrl'
})
.state('root.home', {
url: '/home',
views: {
'menuContent': {
templateUrl: 'templates/home.html',
controller: 'HomeCtrl'
}
}
})
.state('root.topic', {
url: '/topic/:topicId/{inStore}',
abstract: true,
cache: false,
views: {
'menuContent': {
templateUrl: 'templates/topic-view.html',
controller: 'TopicCtrl'
}
},
params: {topicName: null}
})
.state('root.topic.section', {
url: '/section/:sectionType',
views: {
'sectionSpace': {
templateUrl: 'templates/topic-section-view.html',
controller: 'TopicSectionCtrl'
}
}
})
以下是menu-static.html
的摘录<ion-side-menu-content>
<ion-nav-bar class="bar-stable">
<ion-nav-back-button>
</ion-nav-back-button>
<ion-nav-buttons side="right">
<button class="button button-icon button-clear ion-navicon" menu-toggle="right">
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-nav-view name="menuContent">
</ion-nav-view>
</ion-side-menu-content>
以下是home.html的摘录
<ion-view view-title="All Topics">
<ion-nav-title>All Topics</ion-nav-title>
<ion-content>
</ion-content>
</ion-view>
以下是topic-view.html
的摘录<ion-view view-title="NOT SHOWING">
<ion-nav-title>NOT SHOWING</ion-nav-title>
<ion-content>
<ion-nav-view name="sectionSpace">
</ion-nav-view>
</ion-content>
</ion-view>
答案 0 :(得分:2)
另外:网址目前是/ root / topic / ...这似乎是不受欢迎的=&gt;你可以让root拥有url: '',
,这将允许url为/ topic /
以上对我来说不是很好,所以我亲自尝试了这个,它确实为父母工作:
主题-view.html
<ion-view view-title="NOT SHOWING">
<div class="tabs-striped tabs-top tabs-background-balanced tabs-color-light">
<div class="tabs">
<a ng-repeat='section in ["Section1", "Section2", "Section3"]' class="tab-item" ng-click='goTo(section.toLowerCase())'>
{{section}}
</a>
</div>
</div>
<ion-nav-view name='sectionSpace'></ion-nav-view>
</ion-view>
它确实有效。 我不确定这个{inStore}是关于什么的,但也许是早期版本的Ionic / Angular我觉得我在这个代码中工作了这个:http://codepen.io/zargold/pen/qZNJNJ?editors=1011