Как выделить выбранный элемент / элементы в Ionic-списке - PullRequest
0 голосов
/ 01 июня 2018

У меня есть список элементов, попадающих на экран, и я просто хотел выделить выбранный элемент / элементы в списке, пожалуйста, помогите

 <ion-list >
  <button ion-item *ngFor="let route of Routes" (click)="selectCP(route)" >
    {{route.Name}}
  </button>  
 </ion-list>

Ответы [ 2 ]

0 голосов
/ 03 июля 2018

Работает!

[class.stylename]="Some conditional statement that will return true or false"

<!-- This will probably go into your SCSS stylesheet -->
<style>
.highlight {
   background-color: #FFFF33 !important;
}
</style>

<!-- In your HTML code -->
 <ion-list >
  <button ion-item [class.highlight]="route.selected" *ngFor="let route of Routes" (click)="selectCP(route)" >
    {{route.Name}}
  </button>  
 </ion-list>

.ts

route.selected = false;
selectCP(route){
   route.selected =! route.selected;  
}
0 голосов
/ 01 июня 2018

Использование функции условного стиля Angular.

[class.stylename] = "Некоторый условный оператор, который будет возвращать true или false"

Пример:

<!-- This will probably go into your SCSS stylesheet -->
<style>
.highlight {
   background-color: #FFFF33 !important;
}
</style>

<!-- In your HTML code -->
 <ion-list >
  <button ion-item [class.highlight]="route == 1" *ngFor="let route of Routes" (click)="selectCP(route)" >
    {{route.Name}}
  </button>  
 </ion-list>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...