离子条头与离子含量重叠

Question

I'm trying to add bar-header and form-input. 我正在尝试添加bar-header和form-input。 But the username form doesn't appear, probably because it's overlapping with the bar-header. 但是未显示用户名形式，可能是因为它与bar-header重叠。 I've added class="has-header" in ion-content but this doesn't work and the username form and the bar-header still overlap eachother. 我在ion-content中添加了class =“ has-header”，但这不起作用，并且用户名形式和bar-header仍然彼此重叠。 Can anyone help me out? 谁能帮我吗？

This is my code: 这是我的代码：

<!DOCTYPE html>
<html ng-app="myApp">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
    -->

    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <!-- cordova script (this will be a 404 during development) -->
    <script src="cordova.js"></script>

    <!-- your app's js -->
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/services.js"></script>
  </head>
  <body>
    <div class="bar bar-header bar-calm">
                <h1 class="title">bar-calm</h1>
    </div>
    <ion-content class="has-header">
    <div class="list">          
        <label class="item item-input">
            <span class="input-label">Username</span>
            <input type="text">
        </label>
        <label class="item item-input">
            <span class="input-label">Password</span>
            <input type="password">
        </label>
        <label class="item item-input">
            <span class="input-label">Username</span>
            <input type="text">
        </label>
        <label class="item item-input">
            <span class="input-label">Password</span>
            <input type="password">
        </label>
     </div>
     </ion-content>
     <div class="bar bar-footer bar-calm">
        <div class="title">Footer</div>
     </div>`enter code here`
  </body>
</html>

Answer 1

The problem is that you don't create angular app itself. 问题是您自己没有创建角度应用程序。

just add an empty app: 只需添加一个空应用：

angular.module('myApp', ['ionic'])

    .controller('MapCtrl', function($scope) {


    });

http://codepen.io/anon/pen/ZYQqoe http://codepen.io/anon/pen/ZYQqoe

离子条头与离子含量重叠

问题描述

1 个解决方案

解决方案1
1 已采纳 2014-12-09 14:39:24

离子条头与离子含量重叠

问题描述

1 个解决方案

解决方案1 1 已采纳 2014-12-09 14:39:24

解决方案1
1 已采纳 2014-12-09 14:39:24