Does Ionic not compatible with HTML5 element?


#1

Hi all,

I’m a newbie to the ionic framework and I try to create a basic UI for a login page with a html5 element; there is nothing show up after executing ionic lab command. It works well with the ionic UI component. Am I wonder why is that? Thanks for the answer.


#2

Have you a code sample you can share?

In ion-list elements for example it won’t display just any kind of element. as they’re meant to work with ion-item elements.

If you put your stuff directly inside ion-content you should hopefully see your work.


#3

Thanks for the reply, here is my example below. I can show the top part of it but cannot show the second part because they are just plain HTML element wrapped in ion-content. I hope it helps to understand my issue. Thanks & regards.

<ion-content padding>
<form novalidate #sForm="ngForm">
  <ion-item>
  <ion-label floating>First Name</ion-label>
    <ion-input
      type="text"
      name="name"
      ngModel></ion-input>
  </ion-item>

 /***** SECOND PART *****/
    <label>
    <span floating>Last Name</span>
    <input
      type="text"
      placeholder="LastName"
      name="name"
      ngModel>
  </label>
    <label>
    <span floating>User Name</span>
    <input
      type="text"
      placeholder="UserName"
      name="name"
      ngModel>
  </label>
</form>
</ion-content>

#4

Hi Buckethead,

I’m afraid I’m not following the problem. Pasting it straight into a new application I can see everything albeit looks out of place…

I’m willing to help further if you could clarify.

Thank you