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。