ION-LIST填充左侧右侧有不同的内容

时间:2018-05-03 17:14:01

标签: html css ionic-framework fill ion-list

我想用不同国家的不同Weatherdata填充离子列表的左侧和右侧。我希望有一个人可以帮助我。我一直在寻找解决方案。

CLICK HERE FOR THE GUI OF THE APPLICATION

THIS IS THE GUI OF THE GUI

这是我的代码在选择离子列表时的样子:

<ion-view title="Termine" hide-nav-bar="true" id="page3" style="background-color: rgb(220, 220, 224);" >
  <ion-nav-buttons side="right">
      <button class="button button-icon icon ion-plus-round"></button>
  </ion-nav-buttons>
  <ion-content padding="true" class="manual-ios-statusbar-padding">

    <div ng-controller="WeatherBerlinCtrl">
    <!-- WEATHER SECTION -->
    <ion-list id="termine-list">
      <ion-item class="item-thumbnail-left" id="termine-list-item46"style="">

      <img src={{vWeatherLinkIcon}}>
      <h2 style="text-align: left; width:49%; display: inline-block; font-weight: bold;">Berlin {{vWeatherActDegrees}} °C</h2> 

      <!-- <img style="float: right;" src={{vWeatherLinkIcon}}> -->
      <h2>Max: {{vWeatherMaxDegrees}} °C</h2>
      <h2>Min: {{vWeatherMinDegrees}} °C</h2>

<!--       <div class="item-thumbnail-right">
                <img style="float: right;"  src={{vWeatherLinkIcon}}>
     <div ng-controller="WeatherKabulCtrl">
      <h2 style="text-align: right; width:50%;  display: inline-block;  font-weight: bold;">Berlin {{vWeatherActDegrees}} °C</h2>
                      </div> -->

    </ion-list>
    <div class="spacer" style="width: 748px; height: 15px;"></div>`

1 个答案:

答案 0 :(得分:0)

在离子列表中使用离子网怎么样?

 <ion-grid>
  <ion-row>
    <ion-col>
      left
    </ion-col>
    <ion-col>
      right
    </ion-col>
  </ion-row>
</ion-grid>

ionic doc