bootstrap使用angular2

时间:2016-11-22 09:44:00

标签: javascript jquery twitter-bootstrap angular typescript

我有一个Bootstrap我想下拉列表项。列表项包含图像和文本。我正在使用bootstap drop-down菜单单击下拉列表来更新值。

如何使用angular2自定义选择框?

<ul class="btn-group" dropdown>
  <li>
    <button type="button" class="btn dropdown-toggle" dropdownToggle data-toggle="dropdown" dropdown [(ngModel)]="selectaccountno">
      <div class="accountIcon"><i class="fa fa-credit-card-alt" aria-hidden="true"></i>
      </div>
      <strong>Gift Card Account</strong>
      <div>1242 3545 4654 5675</div>
    </button>
    <ul class="dropdown-menu">
      <li>
        <div class="accountIcon"><i class="fa fa-credit-card-alt" aria-hidden="true"></i>
        </div>
        <strong>food Card Account</strong>
        <div>1242 3545 4654 5675</div>
      </li>
      <li class="dropdown-divider"></li>
      <li>
        <div class="accountIcon"><i class="fa fa-briefcase" aria-hidden="true"></i>
        </div>
        <strong>Fuel Account</strong>
        <div>1242 3545 4654 5675</div>
      </li>
      <li class="dropdown-divider"></li>
      <li>
        <div class="accountIcon"><i class="fa fa-credit-card-alt" aria-hidden="true"></i>
        </div>
        <strong>Card Account</strong>
        <div>1242 3535 4654 5675</div>
      </li>
      <li class="dropdown-divider"></li>
      <li>
        <div class="accountIcon"><i class="fa fa-briefcase" aria-hidden="true"></i>
        </div>
        <strong>Account</strong>
        <div>1242 3545 4654 5675</div>
      </li>
    </ul>
  </li>
</ul>

0 个答案:

没有答案