class - 是否有内置方法将 Bootstrap 类分组到 "meta classes"中？

Question

我是 twitter-bootstrap 的新手，这个问题可能已经回答了 1000 次 - 我找不到合适的搜索词。

如果我想在多个元素上重复相同的类组，我如何告诉 bootstrap 将该组中的所有类应用到特定元素上？

例如(伪代码)

animal: {col-zz-5 tip tralala trili li kuki top-margin-20 lorem ipsum}

<li meta-class="animal">gamal</li>
<li meta-class="animal">soos</li>
<li meta-class="animal">kipod</li>

而不是:

<li meta-class="col-zz-5 tip tralala trili li kuki top-margin-20 lorem ipsum">gamal</li>
<li meta-class="col-zz-5 tip tralala trili li kuki top-margin-20 lorem ipsum">soos</li>
<li meta-class="col-zz-5 tip tralala trili li kuki top-margin-20 lorem ipsum">kipod</li>

约束:

我真的不喜欢添加像 LESS 这样的外部解决方案，这会增加另一层复杂性(学习、加载、性能和维护)。

我不想在服务器上这样做。

顺便说一句:我目前的元素是基于angular - 所以如果有一个内置的angular 解决方案，这也是可以接受的。例如。我可以将我的类写成 class="{{ animal }}"，并在中心某处(哪里？)定义“animal”

编辑:

我 fork @NeilKistner 的 fiddler => 有一个可行的解决方案:http://jsfiddle.net/qaZmF/

希望在我结束这个之前听到更多的解决方案。

Answer 1

使用 AngularJS 我能够想出这个，你应该能够使它适应你的元素。

HTML

<div ng-app="App">
    <div ng-controller="Ctrl">
      <li meta-class="{{ animal }}">gamal</li>
      <li meta-class="{{ animal }}">soos</li>
      <li meta-class="{{ animal }}">kipod</li>
    </div>
</div>

JS

function Ctrl($scope) {
  $scope.animal = 'col-zz-5 tip tralala trili li kuki top-margin-20 lorem ipsum';
}

JSFiddle: http://jsfiddle.net/2c24r/