【问题标题】:ng-repeat + ion-infinite-scroll doesn't work on real androidng-repeat + ion-infinite-scroll 在真正的 android 上不起作用
【发布时间】:2016-06-09 13:45:47
【问题描述】:

我在 2 周内一直在使用 ionic 跨平台应用程序,所以,我对此非常陌生。

现在,我发现 ng-repeat exactly like this 存在问题。 是的,收集重复可以解决问题,但会创建另一个问题。 就我而言,每个项目都有不同的大小,并且集合重复无法动态计算它。 这是我的清单重复:

     <ion-list>
        <ion-item class="list card" ng-repeat="feed in feeds" type="item-text-wrap" href="#/tab/feed/{{feed.id_geral}}">
            <div class="item item-avatar">
                <img width="50" src="http://192.168.1.14/vogo/files/perfil/p/{{feed.img_perfil}}">
                <h2>{{feed.nome_perfil }}</h2>
            </div>
            <div class="item item-body">
                <img ng-show="feed.img_link.length > 3"
                     class="full-image" src="{{feed.img_link}}">
                <img ng-show="feed.video.length > 3"
                     class="full-image" src="https://i.ytimg.com/vi/{{feed.video}}/sddefault.jpg" />
                <p>{{feed.post}}</p>
                <p>
                    <a href="#" class="subdued">1 Like</a>
                    <a href="#" class="subdued">5 Comments</a>
                </p>
            </div>
            <div class="item tabs tabs-secondary tabs-icon-left">
                <a class="tab-item" href="#">
                    <i class="icon ion-thumbsup"></i> Like
                </a>
                <a class="tab-item" href="#">
                    <i class="icon ion-chatbox"></i> Comment
                </a>
                <a class="tab-item" href="#">
                    <i class="icon ion-share"></i> Share
                </a>
            </div>
        </ion-item>
    </ion-list>

我一直在尝试通过这种方式解决问题

<div id="dummyRender"  class="list card">
        <div class="item item-avatar">
            <img width="50" src="http://192.168.1.14/vogo/files/perfil/p/{{feed.img_perfil}}">
            <h2>{{dummy.nome_perfil }}</h2>
        </div>
        <div class="item item-body">
            <img ng-show="dummy.img_link.length > 3"
                 class="full-image" src="{{dummy.img_link}}">
            <img ng-show="dummy.video.length > 3"
                 class="full-image" src="https://i.ytimg.com/vi/{{feed.video}}/sddefault.jpg" />
            <p>{{dummy.post}}</p>
            <p>
                <a href="#" class="subdued">1 Like</a>
                <a href="#" class="subdued">5 Comments</a>
            </p>
        </div>
        <div class="item tabs tabs-secondary tabs-icon-left">
            <a class="tab-item" href="#">
                <i class="icon ion-thumbsup"></i> Like
            </a>
            <a class="tab-item" href="#">
                <i class="icon ion-chatbox"></i> Comment
            </a>
            <a class="tab-item" href="#">
                <i class="icon ion-share"></i> Share
            </a>
        </div>
    </div>

并在控制器上创建了一个处理高度的函数

var dummy = document.getElementById("dummyRender");

$scope.renderHeight = function (feedIten) {
    $scope.dummy = feedIten;
    return dummy.clientHeight;
};

调用

<ion-item class="list card" collection-repeat="feed in feeds" type="item-text-wrap" href="#/tab/feed/{{feed.id_geral}}"  item-height="renderHeight(feed)">

但它只适用于文本。

有人可以使用 ng-repeat 或 collection-repeat 或其他方法帮助我解决此问题吗?

谢谢,对不起我的英语水平!

【问题讨论】:

    标签: javascript angularjs cordova ionic-framework cross-platform


    【解决方案1】:

    经过大量工作,这是我悲伤的答案

    这个没有解决办法,它是android 4.4issue还不能修复,所以如果你想接受androids 4.4及更低版本,你不能使用ng-repeat和ion-infinite-scroll。

    您可以只使用具有相同大小的重复列表,还不能使用动态大小。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2017-12-30
      • 1970-01-01
      • 1970-01-01
      • 2021-06-24
      • 2017-08-14
      • 1970-01-01
      • 2018-08-27
      相关资源
      最近更新 更多