Ionic離子視圖標題不顯示

Question

我對Ionic相對較新，我試圖做一個簡單的登錄頁面。但是，當我把它不會顯示標題欄。有誰知道我做錯了什麼？

<ion-view view-title="Sign-In"> 
     <ion-content> 
      <div class="list"> 
       <label class="item item-input"> 
        <span class="input-label">Username</span> 
        <input type="text" ng-model="user.username"> 
       </label> 
       <label class="item item-input"> 
        <span class="input-label">Password</span> 
        <input type="password" ng-model="user.password"> 
       </label> 
      </div> 
      <div class="padding"> 
       <button class="button button-block button-positive" ng-  click="signIn(user)"> 
        Sign-In 
       </button> 
       <p class="text-center"> 
        <a href="#/forgot-password">Forgot password</a> 
       </p> 
      </div> 
     </ion-content> 
    </ion-view> 

Answer 1

您還沒有寫出標題的html。您需要添加一個帶class="bar bar-header"的div來顯示標題。

<ion-view view-title="Sign-In"> 
     <div class="bar bar-header bar-light"> 
      <h1 class="title">Header</h1> 
     </div> 
     <ion-content class="has-header"> 
      <div class="list"> 
       <label class="item item-input"> 
        <span class="input-label">Username</span> 
        <input type="text" ng-model="user.username"> 
       </label> 
       <label class="item item-input"> 
        <span class="input-label">Password</span> 
        <input type="password" ng-model="user.password"> 
       </label> 
      </div> 
      <div class="padding"> 
       <button class="button button-block button-positive" ng-click="signIn(user)"> 
        Sign-In 
       </button> 
       <p class="text-center"> 
        <a href="#/forgot-password">Forgot password</a> 
       </p> 
      </div> 
     </ion-content> 
    </ion-view> 

這裏是一個工作fiddle。