Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is Ion-list supposed to automatically add an arrow on the list item?

The Ionic 2 documentation makes it seem like the arrow automatically comes with it. It isn't working that way for me however.

https://ionicframework.com/docs/components/#lists

<ion-list>
         <ion-item>
           <p>Terms Of Use</p>
         </ion-item>
         <ion-item>
           <p>Privacy Policy</p>
         </ion-item>
</ion-list>
like image 765
Spilot Avatar asked Dec 18 '22 06:12

Spilot


1 Answers

The arrow you're talking about is the Detail arrow (docs). Just like you can see in the docs:

By default, and elements with the ion-item attribute will display a right arrow icon on ios mode.

And

To hide the right arrow icon on either of these elements, add the detail-none attribute to the item. To show the right arrow icon on an element that doesn't display it naturally, add the detail-push attribute to the item.

Regarding Android and Windows phone,

This feature is not enabled by default for md and wp modes, but it can be enabled by setting the Sass variables $item-md-detail-push-show and $item-wp-detail-push-show, respectively, to true. It can also be disabled for ios by setting $item-ios-detail-push-show to false

So if you want to enable it for android and windows phone, you just need to add the following in your variables.scss file:

$item-md-detail-push-show: true;
$item-wp-detail-push-show: true;
like image 184
sebaferreras Avatar answered Jan 17 '23 19:01

sebaferreras