{input hash}

npm install ember-cli

ember new <project-name> --lang en

ember serve

ember generate route input1

import Component from '@glimmer/component'; 
import { tracked } from '@glimmer/tracking'; 
import { action } from '@ember/object'; 
  
export default class Arr2Component extends Component { 
    @tracked 
    data = ''; 
      
    @tracked 
    ar = [ 
        'Ram', 
        'Lalu', 
        'Rohit', 
        'Pokhu', 
        'Arabh', 
        'Sam', 
    ] 
    @action 
    add(item) { 
        this.ar.addObject(item); 
    } 
}

{{#each this.ar as |temp|}} 
<li>{{temp}}</li> 
{{/each}} 
  
<br/> 
<br/> 
<label>Enter Name : </label> 
{{input value=this.data}} 
<br/> 
<input  type="Button" value="Add"
      {{action 'add' this.data}}/>

{{page-title "Input"}} 
<h2> 
    Describing input 
</h2> 
  
<Arr/>

ember generate route input2

import Component from '@glimmer/component'; 
import { action } from '@ember/object'; 
import { tracked } from '@glimmer/tracking'; 
  
export default class ListComponent extends Component { 
    @tracked 
    s = false; 
    @action 
    show() { 
        this.s = true; 
    } 
    get p() { 
        return document.querySelector('#list'); 
    } 
}

{{#if this.s}} 
{{#in-element this.p}} 
    {{#each @a as |temp|}} 
    <li> 
    {{temp}} 
    </li> 
    {{/each}} 
{{/in-element}} 
{{/if}} 
<input type="Button" value='Show list' 
    {{on 'click' this.show}}>

{{page-title "input"}} 
Describing input :  
<div id="list"></div> 
<List @a={{array 'Sam' 'Rahul' 'Dadu' 'Arabh' }} > 
</List>