2016-05-23 26 views
0

私は今、単純なログインページを開発するためにIonicを使用していますが、何らかの理由で、ヘッダーのコードが正しく動作していない - 誤った配置とフォントサイズ - どちらも入力フォームのコードではありません全幅とスタッキングラベルを使用したときに、入力エリアの上にラベルが表示されず、入力エリアの左に表示されます。イオンが正しくロードされていませんか?

.loginファイル{

}

これ:これは、(例えば付属).scssある

<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> 

これは私が使用しているコードでありますそれが私を探している方法です:

incorrect look

+0

例は何ですか?それはデフォルトのイオン性のCSSを持っているかどうか? – thepio

+0

https://devdactic.com/simple-login-example-with-ionic-and-angularjs/ これは私が使用した例です。 私はそれがデフォルトのイオンのCSSを使用すると信じています。 – Arfons

答えて

1

あなたのhtmlに​​がありません。あなたの場合、このようなものでなければなりません:

<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> 
+0

ionic v2に移行した場合、どのように動作しますか? – Arfons

+0

申し訳ありません。自分でionic2を試したことがありません。あなたはその文書を読む必要があります。 – thepio

関連する問題