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>

使用上面的bootstrap组件，当我从下拉列表中选择一个值时，它应该在该下拉列表中显示所选值。有人可以帮我解决这个问题吗？

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

它有许多易于使用的元素，编码非常少

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

2 个答案: