首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >无法在UI上滚动内容/ AngularJS

无法在UI上滚动内容/ AngularJS
EN

Stack Overflow用户
提问于 2014-09-28 09:57:09
回答 1查看 1.4K关注 0票数 0

我刚刚开始使用AngularJS,我正在努力想办法解决这个问题。我似乎从jQuery那里学到了很多坏习惯。我有一个使用Onsen UI / AngularJS和jQuery编写的简单移动页面。我想要的内容正在正确显示,但是我无法滚动内容到最后。我的页面HTML代码如下

代码语言:javascript
运行
复制
    <ons-navigator title="Navigator" var="appNavigator">
    <ons-page>
        <ons-toolbar>
            <div class="left">
                <ons-button style="background-color: white;color: #d00052;"
                            ng-click="appNavigator.resetToPage('home.html', options);"><i class="fa fa-home fa-2"></i>
                </ons-button>
            </div>
            <div class="center">Notice Board</div>
            <div class="right">
                <ons-button style="background-color: white;color: #d00052;"
                            ng-click="appNavigator.resetToPage('login.html', options);"><i
                        class="fa fa-power-off fa-2"></i></ons-button>
            </div>
        </ons-toolbar>
<ons-scoller>
        <ons-list ng-controller="MyCtrl">
            <div ng-repeat="group in groups" style="z-index: 9999;">
                <ons-list-item ng-click="toggleGroup(group)" class="title" ng-class="{active:isGroupShown(group)}">
                    <ons-icon icon="minus-square-o" ng-if="isGroupShown(group)"></ons-icon>
                    <ons-icon icon="plus-square-o" ng-if="!isGroupShown(group)"></ons-icon>
                    <b>{{group.title}}</b>
                </ons-list-item>
                <ons-list-item class="item-accordion" ng-show="isGroupShown(group)">
                    <p style="line-height: 22px;" ng-bind-html="group.content">...</p>
                </ons-list-item>
            </div>
        </ons-list>
</ons-scoller>
    </ons-page>
</ons-navigator>

这个页面的控制器如下所示

代码语言:javascript
运行
复制
    app.controller('MyCtrl', function($scope) {
    $scope.groups = [];
    $.ajax({
        type: 'GET',
        url: 'https://mywebsite/service?mode=data',
        dataType: 'jsonp',
        timeout: 5000,
        success: function(data) {
            $scope.groups = data;
            $scope.$apply();
        },
        error: function(data) {
            $scope.error = true;
            $scope.$apply();
        }
    });



    $scope.toggleGroup = function(group) {
        if ($scope.isGroupShown(group)) {
            $scope.shownGroup = null;
        } else {
            $scope.shownGroup = group;
        }
    };
    $scope.isGroupShown = function(group) {
        return $scope.shownGroup === group;
    };

});

我想既然html代码使用了on -iPhone,它就可以正常滚动(在PhoneGap上),但它不能。这里我漏掉了什么?如果有任何建议或指导,我将不胜感激。

EN

回答 1

Stack Overflow用户

发布于 2015-11-17 20:38:32

你可能只是有一个打字错误。

<ons-scoller>...<ons-scoller>更改为<ons-scroller>...<ons-scroller>

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/26080919

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档