title: Display list in dropdown
body: <p>I want to display list in dropdown using Angular. I tried to implement this:</p>
  
  <p>TypeScript:</p>
  
  <p>Constructor</p>
  
  <pre><code>export class Merchant {
    constructor(
      public id: string,
      public name: string
    ) {}
  }
  </code></pre>
  
  <p>Component:</p>
  
  <pre><code>import {Merchant} from "../domain/merchant";
  import {MerchantService} from "../service/merchant.service";
  
  @Component({
    selector: 'app-terminal',
    templateUrl: './terminal.component.html',
    styleUrls: ['./terminal.component.scss']
  })
  export class TerminalComponent implements OnInit {    
   . ..........
   constructor(private terminalService: TerminalService,
                private merchantService: MerchantService,
                private router: Router,
                private route: ActivatedRoute) {
    }      
    merchants: Merchant[];     
    ngOnInit() {       
      this.route.params.pipe(
        flatMap(params =&gt; {
          if (params['id']) {
            return this.terminalService.get(params['id']);
          } else {
            return of(null);
          }
        })
      ......   
    }    
  }
  </code></pre>
  
  <p>HTML code:</p>
  
  <pre><code>&lt;div class="form-group type"&gt;
      &lt;div class="input-group-prepend"&gt;
        &lt;label for="type"&gt;Merchant&lt;/label&gt;
      &lt;/div&gt;
      &lt;select class="custom-select" name="type" [(ngModel)]="terminal" id="type" required&gt;
        &lt;option selected&gt;&lt;/option&gt;
        &lt;option [value]="type" *ngFor="let merchant of merchants"&gt;{{merchant.name}}&lt;/option&gt;
      &lt;/select&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>I get empty dropdown. Do you have any idea where I'm wrong?</p>