Javascript 离子导航按钮不显示
我试图使用Javascript 离子导航按钮不显示,javascript,angularjs,ionic-framework,ionic,Javascript,Angularjs,Ionic Framework,Ionic,我试图使用为导航栏中的特定选项卡视图启用“编辑”按钮,但它们没有显示。上面提到必须是的孩子,所以我有点不明白为什么它不起作用。我读到人们在抽象视图中的导航按钮有问题,但是spots.html不是抽象视图 下面是spots.html中不起作用的导航按钮 <ion-view title="Spots"> <ion-nav-buttons side="right"> <button class="button button-clear button
为导航栏中的特定选项卡视图启用“编辑”按钮,但它们没有显示。上面提到
必须是
的孩子,所以我有点不明白为什么它不起作用。我读到人们在抽象视图中的导航按钮有问题,但是spots.html
不是抽象视图
下面是spots.html中不起作用的导航按钮
<ion-view title="Spots">
<ion-nav-buttons side="right">
<button class="button button-clear button-positive">Grid</button>
</ion-nav-buttons>
<ion-content>
<div ng-hide="gridView" class="list">
<a ng-repeat="spot in spots" ui-sref="tab.spot-detail({ id:{{spot.id}} })" class="item item-thumbnail-left">
<img ng-src="{{ spot.thumb_url }}">
<h2>{{ spot.name }}</h2>
</a>
</div>
</ion-content>
</ion-view>
我的index.html的相关部分
<body ng-app="droppin">
<ion-nav-view></ion-nav-view>
</body>
当你说“不工作”时,对我们来说(至少对我来说)是相当模糊的。一定要说“不可见”、“可见不可点击”、“可点击但无效果”、“可点击但效果错误”等
我可以从代码中看到一个明显的错误是ui sref=“tab.spot detail({id:{{spot.id}}})”
。您应该省略内部的{{}
求值。我是通过删除按钮正片
类来实现的。显然,类的混合以及导航栏的颜色导致了按钮的混合。你能添加index.html的主体部分吗?ion视图的几个声明可能会影响标题。@benek刚刚添加了它。我没有确切的解释,但对我来说有用的是:在ion导航栏中有ion导航按钮(在ion导航视图/ion视图之外),对于特定的视图按钮,我使用了ion标题栏和基本按钮。抱歉,我想我有点含糊不清。我说的“不工作”是指他们没有出现在导航栏上。对于这个特定的问题,我试图添加一个清晰的“编辑”按钮,但它没有显示出来。谢谢你指出另一个错误,我不知道你可以省略{{}
。这段代码仍然有效,所以我不认为它会影响我的主要问题,我会更改它,并让您知道它是否有效。
$stateProvider
.state('welcome', {
url: "/welcome",
controller: 'WelcomeCtrl',
templateUrl: "templates/welcome.html",
data: {
requiresLogin: false
}
})
// setup an abstract state for the tabs directive
.state('tab', {
url: "/tab",
abstract: true,
templateUrl: "templates/tabs.html"
})
.state('tab.spots', {
url: '/spots',
views: {
'tab-spots': {
templateUrl: 'templates/tab-spots.html',
controller: 'SpotsCtrl'
}
},
data: {
requiresLogin: true
}
})
<body ng-app="droppin">
<ion-nav-view></ion-nav-view>
</body>