Custom input in ion-item not visible


#1

Hello,

I created a custom input component that works well when just included inside a form. However, if I put it inside an ion-item element, it just does not appear (it’s not even in the DOM):

<form *ngIf="form" [formGroup]="form">
  <ion-list>
    <ion-item>
      <ion-label>TEST</ion-label> // the label is visible
      <loc-input formControlName="location"></loc-input> // the location input element is not visible and not part of the DOM
    </ion-item>
  </ion-list>
</form>

If I replace “loc-input” with an “ion-input” it works. Apparently I have to add an attribute to loc-input to make it work, but I have no idea which one. Do you have an idea?


#2

Is there really no way to put display a custom element inside an ion-item? :frowning:


#3

You cab do thinks like:

<ion-label>My Label</ion-label>
<ion-item item-content>
  <my-input>
  or
  <p>Custom HTML</p>
</ion-item>