html - 如何使用背景图像设置 Ionic 列表项高度

Question

在 Ionic 中，我试图显示一个元素列表，每个元素都有一个背景图像。

我想增加高度，但我目前的解决方案只是增加了空白区域，并没有显示更多的背景图像:

<ion-content>
    <ion-list>
        <ion-item back-img="{{post.image.url}}" ui-sref="app.post({id:post.ID})" ng-repeat="post in data.posts" ng-style="{'height': '250px'}" >
            {{post.title}}
        </ion-item>
    </ion-list>
</ion-content>

.directive('backImg', function(){
    return function(scope, element, attrs){
        var url = attrs.backImg;
        var content = element.find('a');
        content.css({
            'background': 'url(' + url +')',
            'background-size' : 'cover'
        });
    };

如何设置列表项的高度，使每一行的背景图片都能完整显示？

(我假设我必须在容器上设置 background-CSS，而不是 anchor ？如何？)

Answer 1

通过使用“line-height”而不是“height”解决了这个问题:

ng-style="{'line-height': '250px'}"

虽然这不允许换行较长的文本。