How to pass parameters to an ember component?

I'm still new in ember js and currently using ember version 3.2.6.

I cannot seem to pass parameter to ember component, what did I missed?

app/templates/application.hbs

<UserCard
  @userName='James123'
  @firstName='James'
  @lastName='Smith'
/>
<UserCard
  @userName='Jane123'
  @firstName='Jane'
  @lastName='Smith'
/>

app/components/user-card.hbs

<br/>
<strong>User Card</strong><br/>
<label>UserName: </label><br/>
<label>First Name: </label><br/>
<label>Last Name: </label><br/>

Result