<ion-item [showArrow(item)]>
</ion-item>
The function showArrow will return detail-push or detail-none depending where the item contains detail view.
<ion-item [showArrow(item)]>
</ion-item>
The function showArrow will return detail-push or detail-none depending where the item contains detail view.
And what is your question or problem?
Need to bind dynamically detail-push/detail-none
<ion-item *ngFor ="let item of Items" detail-push/detail-none >
</ion-item>
Some ion-item will contain detail-push and reaming detail-none. These values need to be populated from function. But not sure how to achieve this.
Solved the issue by using ion-icons <ion-icon right float-right *ngIf="showArrow(item)" name="arrow-forward"></ion-icon>.
Thanks everyone for your help…
[attr.detail-push]="editing ? 'true': null"
where editing is a boolean attribute
Your solution is a bit ugly, because you are adding the icon yourself (and it doesn’t look as nice as the default detail arrows).
A nicer way would be:
<ion-list>
<button [attr.detail-none]="showArrow(item) ? null : ''" *ngFor="let item of items" ion-item (click)="stuffThatHappensWhenClicked(item)">
<ion-avatar item-start>
<img src="{{item.avatar}}"/>
</ion-avatar>
<h2>{{item.name}}</h2>
</button>
</ion-list>
Now, when your showArrow()
method returns true, detail-none
is not shown, but when it’s false, it is added to button
.