我正在构建一个使用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;
};