Issue
I'm working on a form. One of the fields must ask the user to choose an image from a selection. I would like to achieve a similar result.
So I thought of an <ion-select>
which would have a corresponding <ion-select-option>
for each image, like this
<ion-item>
<ion-label>Images</ion-label>
<ion-select>
<ion-select-option>
<ion-img value="image1" src="https://via.placeholder.com/150"></ion-img>
</ion-select-option>
<ion-select-option>
<ion-img value="image2" src="https://via.placeholder.com/150"></ion-img>
</ion-select-option>
</ion-select>
</ion-item>
but I get the following result.
The problem is that the images are not displayed and that the ion-select
dialog box is not very suitable for image selection. So I don't know if another ionic component would do a better job or if I should choose a non-ionic solution...
Solution
It is not possible to add images in ion-select-option but you can achieve the same thing by your own by :
- create a page and make normal ion-list with a ngfor and inside each item put an image and before it a radio button for single choice or checkbox for multichoice.
- open this page as modal and give this modal custom css in golobsl .scss file as normal select alert like (width:450px;height:350px;).
- when you open the modal send array that will contain images or api link to requested when modal opens.
- get the props of modal that is sent with it with navParams and but that you will get what you wanted exactly.
And for any more info write a comment and will be with you anytime.
Answered By - Mostafa Harb
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.