(click) event doesn't work anymore with injected content in ionic 4 beta

Ionic Framework
1

I try to switch from ionic 3 to 4.
In a list, I have some text injected from my database. I want the user to be able to click on this text.
Here is my code, which was OK in ionic 3 :

<ion-item  [ngClass]="item.nature" (click)="itemTextShow(item)">
	<ion-icon slot="end" size="small" class="su" name='thumbs-up' *ngIf="item.su>0">
	<span  [innerHTML]="sanitizer.bypassSecurityTrustHtml(item.questionaff)"></span>
</ion-item>

With ionic 4, the text is injected, but the (click) doesn’t work on the text (it triggers on the icon, or everywhere in the <ion-item>out of the textbox, and even in the background space between the lines or the bloc letters !

I believed that this happens because the text is injected in the shadow dom, but it’s not the case…

Has someone encountered this issue ?

2

About the same subject I saw an answer on Githut like

Add the button attribute! it makes ion-item to have a <button> under the hood

so i guess you should add button attribute to your ion-item, would you like to give a try?

3

Thank you so much !

<ion-item button="true" [ngClass]="item.nature" (click)="itemTextShow(item)">

did the job (It should be included in the docs ?)

4

Cool

It kind of is documented https://github.com/ionic-team/ionic/blob/master/angular/BREAKING.md (see ion-item button)

5

I had never seen this page ! Very useful, thanks again !

1 Like