Кнопки Ion nav не отображаются

Я пытаюсь включить кнопку «Редактировать» для определенного вида вкладок в навигационной панели с помощью <ion-nav-buttons>, но они не отображаются. В documentation упоминается, что <ion-nav-buttons> должен быть ребенком <ion-view>, которым это является, поэтому я немного смущен, почему он не работает. Я читал, что у людей были проблемы с навигационными кнопками внутри абстрактного вида, но spots.html не является абстрактным видом.Кнопки Ion nav не отображаются

Ниже находится кнопка nav, которая не работает внутри spot.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>

tabs.html

<ion-nav-bar class="bar-positive"> 
    <ion-nav-back-button class="button-clear"> 
    <i class="ion-chevron-left"></i> 
    </ion-nav-back-button> 
</ion-nav-bar> 

<ion-tabs class="tabs-icon-top tabs-striped tabs-color-positive"> 

    <!-- Spots Tab --> 
    <ion-tab title="Spots" icon="icon ion-ios7-world" href="#/tab/spots"> 
    <ion-nav-view name="tab-spots"></ion-nav-view> 
    </ion-tab> 

    <!-- Upload Tab --> 
    <ion-tab title="Upload" icon="icon ion-ios7-camera" href="#/tab/upload"> 
    <ion-nav-view name="tab-upload"></ion-nav-view> 
    </ion-tab> 

    <!-- Friends Tab --> 
    <ion-tab title="Friends" icon="icon ion-ios7-people" href="#/tab/friends"> 
    <ion-nav-view name="tab-friends"></ion-nav-view> 
    </ion-tab> 

    <!-- Account Tab --> 
    <ion-tab title="Account" icon="icon ion-gear-b" href="#/tab/account"> 
    <ion-nav-view name="tab-account"></ion-nav-view> 
    </ion-tab> 

</ion-tabs>

И соответствующая часть моего файла маршрутизатора app.js

$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 
    } 
    })

Соответствующая часть моего index.html

<body ng-app="droppin"> 
    <ion-nav-view></ion-nav-view> 
</body>

источник

2015-06-29 Sean

Можете ли вы добавить часть тела вашего index.html? несколько деклараций ионного вида могут затенять заголовок. – benek

@benek Просто добавил. – Sean

У меня нет точного объяснения, но для меня это работает: с ионно-навигационными кнопками внутри ионно-навигационного бара (из ионно-навигационного/ионного) и для конкретных кнопок просмотра , Я использую ионный заголовок и базовую кнопку внутри него. – benek

Я получил его для работы, удалив класс button-positive. Очевидно, что смесь классов вместе с цветом моего навигатора заставила кнопку вставить.

источник

2015-08-30 21:58:05 Sean

Когда вы говорите " не рабочий ", это довольно неопределенно для нас (по крайней мере, я). Скажите что-то вроде «невидимого», «видимого не кликабельного», «кликабельного, но без эффекта», «clickable с неправильным эффектом» и т. Д.

Одна очевидная ошибка, которую я вижу из кода: ui-sref="tab.spot-detail({ id:{{spot.id}} })". Вы должны опустить {{}} внутри оценки.

источник

2015-06-29 03:27:30 Icycool

Извините, я думаю, я был немного расплывчатым. «Не работает» я имел в виду, что они не появляются в навигационной панели. Для этой конкретной проблемы я пытаюсь добавить четкую кнопку «Изменить», и она не появляется. Спасибо, что указали на другую ошибку, я не знал, что вы можете оставить «{{}}'. Этот фрагмент кода все еще работает, хотя я не думаю, что это влияет на мою главную проблему, я изменю его и дам вам знать, если это произойдет. – Sean

Кнопки Ion nav не отображаются

ответ

Смежные вопросы