Question

我正在使用离子框架来创建一个简单的应用程序（您可以通过itunes搜索轨道）。但是，当显示大量结果时，离子含量不可滚动。这是我的标记：

<!DOCTYPE html>
<html ng-app="hiphop">

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">

    <title>Ionic-AngularJS-Cordova</title>

    <!-- Ionic framework - replace the CDN links with local files and build -->
    <link href="http://code.ionicframework.com/1.0.0-beta.1/css/ionic.min.css" rel="stylesheet">
    <script src="http://code.ionicframework.com/1.0.0-beta.1/js/ionic.bundle.min.js"></script>
    <script src="http://code.ionicframework.com/1.0.0-beta.1/js/ionic.bundle.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="js/app.js"></script>

    <script src="cordova.js"></script>


</head>

<body ng-controller="SearchCtrl" ng-app="hiphop">
    <ion-pane>
        <ion-header-bar class="bar-stable">
            <label class="item-input-wrapper header">
                <i class="icon ion-android-search placeholder-icon"></i>
                <input type="search" placeholder="Search" ng-model="search.query" ng-enter="search()" />

            </label>
        </ion-header-bar>
        <ion-content class="has-header" animation="slide-left-right" padding="true" scroll="true" has-bouncing="true">
            <!-- our list and list items -->
            <div class="list">
                <a class="item item-avatar" href="#" ng-repeat="item in items">
                    <img src="{{ item.artworkUrl60 }}">
                    <h2>{{item.trackName}}</h2>
                    <p>{{item.artistName}}
                    </p>
                </a>
            </div>
        </ion-content>
    </ion-pane>
</body>

</html>

Codepen demo（还有js）。

为什么不能滚动？怎么做？

PS：我使用的是英特尔XDK

Answer 1

您已经包含了ionic.bundle个脚本2次，我在您的代码笔示例中删除了一个并滚动工作。

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

内容在离子中不可滚动

1 个答案: