离子收集重复高度问题

时间:2016-01-18 16:41:24

标签: html angularjs ionic-framework

我正在构建一个使用collection-repeat的应用程序但是它要求我提供项目高度,因为它无法计算它。它无法计算,因为列表在加载页面时不可见,是否有办法设置响应的动态高度,因为我使用的当前方法没有响应。

Html代码

<ion-list ng-show="query[queryBy]">
        <!-- Creates each item through collection-repeat and is filtered by the query linked to the search field -->
        <!-- ng-click opens the modal that will have the enlarged office address and the map of the office -->
            <ion-item class="item-text-wrap item-icon-right" id="output" collection-repeat="office in offices|filter:query" ng-controller="ModalCtrl" ng-click="openModal(office.Lat, office.Long); lastview(office.id);" collection-item-height="getItemHeight(office, office.$index)" collection-item-width="100%">
                <!-- Outputs all the data from offices.json -->
                <h3 id="LocName">{{office.LocationName}}</h3>
                <p id="details">{{office.LocAddressLine1 + ", " + office.LocAddressLine2 + ", " + office.LocCity + ", " + office.LocCountryDescription + ", " + office.LocZipPostalCode}}</p>

                <!-- Creates the favourite icon on each list item, when the star is clicked the togglefav function is run -->
                <i ng-class="{'icon ion-android-star': favicon(office.id), 'icon ion-android-star-outline': !favicon(office.id)}" ng-click="togglefav(office.id); $event.stopPropagation();"></i>
            </ion-item>

高度控制

$scope.getItemHeight = function(item, index) {
    //Make evenly indexed items be 10px taller, for the sake of example
    return (index % 2) === 0 ? 50 : 60;
  };

0 个答案:

没有答案