離子無法正確加載元素？

Question

我現在正在使用Ionic開發一個簡單的登錄頁面，但是由於某種原因，標頭的代碼無法正常工作-對齊方式和字體大小錯誤-輸入表單的代碼也不正確-它們應為全角當我完全按照示例使用堆疊標簽時，標簽不是位於輸入區域的頂部，而是位於輸入區域的左側。

這是我正在使用的代碼：

<script src="cordova.js"></script>
<div class="bar bar-header bar-light">
    <h1 class="title">Login</h1>
</div>

<ion-content class="login">
    <div class="list">
        <label class="item item-input">
          <input type="text" placeholder="username" ng-model="data.username">
        </label>
        <label class="item item-input">
          <input type="password" placeholder="password" ng-model="data.password">
        </label>
    </div>
    <button type="submit" class="button-full button-positive" ng-click="login()">Login</button>
</ion-content>

這是.scss（示例隨附）：

。登錄 {

}

這是我的樣子：

Answer 1

您在HTML中缺少<ion-view></ion-view> 。 在您的情況下應該是這樣的：

<ion-view view-title="Login" name="login-view">
  <ion-content class="login">
    <div class="list">
      <label class="item item-input">
        <input type="text" placeholder="username" ng-model="data.username">
      </label>
      <label class="item item-input">
        <input type="password" placeholder="password" ng-model="data.password">
      </label>
    </div>
    <button type="submit" class="button-full button-positive" ng-click="login()">Login</button>
  </ion-content>
</ion-view>