2016-03-22 9 views
0

ion-nav-back-buttonでページビューをしようとしています。ionic-nav-back-buttonが隠されています

これは私のコードhtmlです。

<ion-nav-bar class="bar-main"> 
 
    
 

 
    <ion-nav-back-button class="button-clear" side="left"> 
 
     <ion-icon name="edit" role="img" class="ion-arrow-left-c menu-icon" arial-label="back"> 
 

 
     </ion-icon> 
 
    </ion-nav-back-button> 
 
    
 
     <ion-nav-buttons side="right"> 
 
     <button class="button button-clear" ui-sref="editevent({ idevent : event.$id })"> 
 

 
      <ion-icon name="edit" role="img" class="ion-edit menu-icon" arial-label="edit"> 
 

 
      </ion-icon> 
 
     </button> 
 
    </ion-nav-buttons> 
 
    
 

 
    
 
</ion-nav-bar> 
 

 
<ion-view class="content"> 
 
    <ion-nav-title>{{event.title}}</ion-nav-title> 
 
    <ion-content class="background-white"> 
 
     <div class="event_view-desc" >{{event.description}}</div> 
 
       
 

 
</ion-content> 
 
</ion-view>

しかし、このページは、イオンのnav-バックボタンは表示されませ。私は間違いがありますか?

コードのHTMLが生成するには、次のとおりです。

<ion-header-bar class="bar-main bar bar-header" align-title="center"><button class="button back-button buttons hide button-clear header-item" side="left" ng-click="$ionicGoBack()" style="transition-duration: 0ms;"> 
 
      <ion-icon name="edit" role="img" class="ion-arrow-left-c menu-icon" arial-label="back"> 
 

 
      </ion-icon> 
 
     <span class="back-text" style="transition-duration: 0ms; transform: translate3d(0px, 0px, 0px);"><span class="default-title">Back</span><span class="previous-title hide"></span></span></button><div class="title title-center header-item" style="transition-duration: 0ms; transform: translate3d(0px, 0px, 0px); left: 36px; right: 36px;"><span class="nav-bar-title ng-binding">geo3</span></div><div class="buttons buttons-right header-item" style="transition-duration: 0ms;"><span class="right-buttons"> 
 
      <button class="button button-clear" ui-sref="editevent({ idevent : event.$id })" href="#/editevent/-KDScn4Yw3uEryrNT8ow"> 
 

 
       <ion-icon name="edit" role="img" class="ion-edit menu-icon" arial-label="edit"> 
 

 
       </ion-icon> 
 
      </button> 
 
     </span></div></ion-header-bar>

なぜ私のバックボタンのコンテンツを隠すクラス?

答えて

0

これは、Ionic戻るボタンのデフォルト設定であるためです。彼らはあなたがあなた自身のプログラミングをすべて行う必要はありませんので、この関数で構築しました。このボタンは、ページを戻すオプションがある場合にのみ表示されます。

リストがあるとしましょう。アイテムをクリックすると、そのアイテムに関するすべての情報を含む新しいページが開きます。そのページに戻ると、戻るボタンが表示されます。

バックアイコン付きのボタンが必要な場合は、www.ionicons.comをご覧ください。通常のボタンだけでそれらの1つを使用することができます。

関連する問題