如何在Angular 2中创建选择值下拉值？

Question

<li class="dropdown"> 
    <a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Select fruit <span class="caret"></span></a> 
    <ul class="dropdown-menu"> 
     <li *ngFor="let fruit of Vegetables.Fruits"> 
      <a href="#">{{fruit.Name}}</a> 
     </li> 
    </ul> 
</li> 

通过上述自举组件，当我从下拉列表中选择一个值，它应该显示在下拉列表中选择的值。有人可以帮我解决这个问题吗？

Answer 1

这里是选择框的工作示例。数据在component.ts文件中创建，然后在html文件中循环。

那么试试这个，用我的代码给你一个例子。粘贴在你component.ts文件

cardTypes = ['American Express', 'Discover', 'Master Card', 'Visa']; 

然后转到您的HTML文件，并粘贴此在，

<div class="form-group col-sm-12 col-md-4"> 
    label for="state_address">Cards</label> 
     <div class="input-group"> 
      <span class="input-group-addon"><i class="fa fa-street-view"></i> 
      </span> 
    <select class="form-control" id="cardTypes"formControlName="cardTypes"> 
    <option *ngFor="let cardType of cardTypes">{{cardType}}</option> 
    </select> 
    </div> 
    </div> 

Answer 2

使用PrimeNG

https://www.primefaces.org/primeng/#/dropdown

它在容易的许多元素-to-使用方式具有非常少的编码