11

你知道是否有人将 Bootstrap 的脚本移植到 AngularJS 中吗？

我的应用程序需要 Bootstrap 的拆分按钮下拉菜单，我真的很想避免拉入 jQuery。我似乎无法通过谷歌搜索它。

4

3 回答 3

33

看看这个演示：http: //jsfiddle.net/guillaumebiton/8muRC/

只有 Angular 的强大功能：

<div class="btn-group" ng-class='{open: open}'>
    <button class="btn">Action</button>
    <button class="btn dropdown-toggle" data-toggle="dropdown" ng-click='open=!open'>
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
        <li><a href="#">Action</a></li>
        <li><a href="#">Another action</a></li>
        <li><a href="#">Something else here</a></li>
        <li class="divider"></li>
        <li><a href="#">Separated link</a></li>
    </ul>
</div>

它只使用一个变量“open”，它是真或假。

于 2012-10-31T12:47:16.533 回答
10

作为 angular-ui 的一部分，我们正致力于在纯 AngularJS 中创建引导程序的小部件（不依赖于 3rd 方 JS 库，仅依赖于引导程序的 CSS）。

存储库位于此处：https ://github.com/angular-ui/bootstrap

这是正在进行的大量工作，但已经有 dropdown-toggle 指令： https ://github.com/angular-ui/bootstrap/blob/master/src/dropdownToggle/dropdownToggle.js

你可以像这样使用它：

<div ng-controller="MyCtrl">
  <div class="btn-group">
      <a class="btn dropdown-toggle">
        Actions
        <span class="caret"></span>
      </a>
      <ul class="dropdown-menu">
          <li><a>Action 1</a></li>
          <li><a>Action 2</a></li>
      </ul>
  </div>
</div>

请注意，该指令在类级别上运行，因此添加dropdown-toggle类使其可操作就足够了！

再一次，这是正在进行的工作（整个工作大约在 2-3 周前开始），因此非常欢迎错误报告/拉取请求！

于 2012-10-21T18:50:44.520 回答
2

您可以尝试使用此指令将 angularjs 选择框转换为引导程序的下拉列表：http ://jsfiddle.net/M32pj/28/ `示例：

<select ng-model="example1" bs-selectbox>
 <option value="1">One</option>
 <option value="2">Two</option>
</select>

`

于 2013-03-20T15:54:15.043 回答