Ionic 列表、文本 自动 换行

1.采用row 布局的row-warp 来处理

    <div class="item  item-icon-right">
       <span>图片相册</span>
       <i class="icon ion-images royal" data-tap-disabled="true" ng-click="taskXCpicker()"></i>
     </div>
   <div class="row row-wrap item-calm" >
     <div class="col col-50" ng-repeat="(k,v) in images"><img ng-src="{{v.imgurl}}"   style="width:120px;height:120px; "/>
       <p><button type="button" class="button button-small button-outline button-positive " ng-click="delimgs(v.imgurl)">删除</button></p></div>
     <div >
     </div>
   </div>

2.采用css 样式 clearfix处理

<div ng-if="showloading==false">
            <div>
                <div class="col-48" ng-repeat="v in  portalListData">
                    <a href="#/product_content/{{v.Id}}">
                        <img src="{{ENV.imgUrl}}{{v.ImgUrl}}" alt="" />
                        <p class="product-title">{{v.Title}}</p>
                        <p class="product-price">
                            <span class="old-price"> ¥{{ v.MarkPrice }}</span>
                            <span class="now-price">特价: <span class="price">¥{{ v.SellPrice }}</span></span>
                        </p>
                    </a>
                </div>
                <div class="clearfix"></div>
            </div>
        </div>

3.文本超出自动换行显示 采用item-text-warp

 <div class="card">
      <div class="item item-divider">
       物品信息
      </div>
      <div class="item-text-wrap ">
        <div  class="item item-thumbnail-left" ng-repeat="o in orderDetails.order_goods">
          <!--<img  src="{{ENV.imgUrl}}{{o.ImgUrl}}" onerror="this.src='img/ionic.png'">-->
          <img  ng-src="{{ENV.imgUrl}}{{o.ImgUrl}}" />
          <h2>{{o.GoodsTitle}}</h2>
        <p >
          <span class="red"> ￥{{o.RealPrice}}</span></p>
      </div>

      </div>
    </div>

4.展示效果