问题
I have a problem, i have a code that I have displayed item which lead me to a page where shows detail of each item but this page does not show me the " ion -tab "
Any help
Thank You
Annex codes:
router:
.config(function($stateProvider, $urlRouterProvider, $ionicConfigProvider){
$ionicConfigProvider.navBar.alignTitle("center");
$stateProvider
.state("app",{
templateUrl: "templates/app.html",
url: "/app",
abstract: true
})
.state("app.noticias", {
url: "/noticias",
views: {
"app-noticias":{
templateUrl: "templates/noticias.html",
controller: "noticiasCtrl"
}
}
})
.state('forgotpassword', {
url: "/forgot-password/:id?tit?bgd?fec?com",
templateUrl: "templates/forgot-password.html"
})
$urlRouterProvider.otherwise("/app/noticias");
})
code:
<ion-view title="Noticias">
<ion-content ng-controller="noticiasCtrl" style="top:0">
<ion-list>
<ion-item ng-repeat="item in rawData.slice(1, n)" class="item-noticias overlay" ng-style="{'background':'url(img/'+item.bg +') no-repeat center', 'background-size':'cover'}">
<div class="overlay" ui-sref="forgotpassword({ id: item.tipo, tit: item.titulo, bgd:item.bgdetail, com:item.com, fec:item.fec })">
<span class="tipo">{{ item.tipo }}</span>
<span class="titulo">{{ item.titulo }}</span>
<span class="link">Leer mas <img src="img/right-arrow.png"></span>
</div>
</ion-item>
</ion-list>
</ion-content>
</ion-view>
Page detail:
<ion-view title="forgotpassword">
<ion-nav-buttons side="left">
<button class="button" ng-click="$ionicGoBack($event)"></button>
</ion-nav-buttons>
<ion-content ng-controller="noticiasCtrl" style="top:0">
<div class="header-image" ng-style="{'background':'url(img/'+bgd +') no-repeat center', 'background-size':'cover'}">
<div class="overlayPrinD">
<div class="overlayPrinSecD">
<span class="tipo">{{ id }}</span>
<span class="titulo">{{ tit }}</span>
</div>
</div>
</div>
<p class="fec">{{ fec }}</p>
<p class="texto">{{ com }}</p>
</ion-content>
</ion-view>
回答1:
I don't see you using the ion-tab directive anywhere in the markup. I can't tell from your question which views are supposed to be in the tabs, so here's generic solution you can use as an example:
// Routes
.state('dashboard.tabs', {
url: "/tabs",
abstract: true,
templateUrl: "templates/tab-container.html"
})
.state('dashboard.tab1', {
url: "/tab1",
views: {
'tab1-tab': {
templateUrl: "templates/tab1.html",
controller: 'Tab1Ctrl as vm',
}
}
})
.state('dashboard.tab2', {
url: "/tab2",
views: {
'tab2-tab': {
templateUrl: "templates/tabs2.html",
controller: 'Tab2Ctrl as vm',
}
}
})
// Tab markup for tab-container.html template
<ion-view view-title="Some Title">
<ion-tabs class="tabs-positive">
<ion-tab title="Tab 1" ui-sref="some.route.item1">
<ion-nav-view name="tab1-tab"></ion-nav-view>
</ion-tab>
<ion-tab title="Tab 2" ui-sref="some.route.item2">
<ion-nav-view name="tab2-tab"></ion-nav-view>
</ion-tab>
</ion-tabs>
</ion-view>
// Tab1 and/or Tab2 templates
<ion-view view-title="Tab #">
<ion-content>
// Your content
</ion-content>
</ion-view>
You could also include the individual tab markup in the container template using script tags with ng-template.
<script id="templates/tab1.html" type="text/ng-template">
<ion-view view-title="Tab 1">
<ion-content class="padding">
<p>
// Your content
</p>
</ion-content>
</ion-view>
</script>
来源:https://stackoverflow.com/questions/31881046/not-displaying-ion-tab-in-page-detail