Подтвердить что ты не робот

Удалить разделитель ионов

Как я могу удалить разделитель <ion-item>? У меня есть следующий код для отображения 4 элементов в строке:

<ion-row ion-list>
    <ion-col width-25 *ngFor="let player of players">
              <ion-item color="dark">
                  <ion-avatar item-left>
                      <img [src]="photo" class="img img-circle"/>
                  </ion-avatar>
                  {{user.name}}
              </ion-item>
              </ion-col>
            </ion-row>

и вывод показывает 4 изображения в строке, как исключено, но каждое изображение имеет белый разделитель под ним. Я не хочу делителя.

Я попытался установить style="border:none", но он этого не сделал.

4b9b3361

Ответ 1

использовать no-lines

<ion-row ion-list>
    <ion-col width-25 *ngFor="let player of players">
         <ion-item no-lines color="dark"><!-- here -->
              <ion-avatar item-left>
                  <img [src]="photo" class="img img-circle"/>
              </ion-avatar>
              {{user.name}}
         </ion-item>
     </ion-col>
</ion-row>

Ответ 2

По какой-то причине это не сработало для меня. Но наличие строк = "никто" работал отлично.

Для ионного v4

<ion-item lines="none"> </ion-item>

Вытащил из ионных документов... https://ionicframework.com/docs/api/list

Ответ 3

Для ionic v4 вы должны использовать свойство lines:

<ion-row ion-list>
    <ion-col width-25 *ngFor="let player of players">
         <ion-item lines="none" color="dark">
              <ion-avatar item-left>
                  <img [src]="photo" class="img img-circle"/>
              </ion-avatar>
              {{user.name}}
         </ion-item>
    </ion-col>
</ion-row>

Ответ 4

Я пытался без линии, но она не работала в ионном 4

Только эта работа для меня в ионной 4:

<ion-item lines="none"> </ion-item>

<ion-list>
 <ion-item lines="none" button detail *ngFor="let note of notesService.notes">
      <ion-label>{{ note.title }}</ion-label>
    </ion-item>
</ion-list>