使用Angular指令用HTML標簽替換Bootstrap類分配

Question

我可以看到這是一次AngularUI討論 ...

我想知道是否還有其他人實現了Angular指令，該指令可以讓我替換像這樣的傳統Bootstrap加載標記

<div class="container-fluid">
  <div class="row-fluid">
    <div class="span4 offset2">
    </div>
  </div>
</div>

具有易於閱讀，以元素為中心的標記，與此類似

<container-fluid>
  <row>
    <column span4 offset2>
    </column>
  </row>
</container-fluid>

似乎很容易實現，這使我認為其他人已經做到了這一點（或者由於某種原因而不值得這樣做（也許會對性能造成影響嗎？））

有人做過嗎？

如果沒有，是否有我不應該自己實施的理由？

Answer 1

有幾個Angular + Bootstrap項目， 最著名的是AngularStrap和UI Bootstrap ，我敢肯定，您已經意識到了它們。 當然，它們提供自定義指令，但僅用於需要此指令的東西（即Bootstrap JS組件）。

似乎很容易實現，這使我認為其他人已經做到了這一點（或者由於某種原因而不值得這樣做（也許會對性能造成影響嗎？））

除了不必要的性能開銷外，這還將大大降低Bootstrap作為前端框架的價值-具有您已經通過的學習曲線。

在這個方向上有一些發展-例如angular-deckgrid ，但是我不知道任何雄心勃勃的，全面的（面向Web的）框架，例如Bootstrap或Angular Material。

為自己量身定制定制語法會更有意義。 您可以查看ui-alias （ui-tools的一部分）。 它在當前狀態下是嚴格的，但它是對指令進行智能處理的一個很好的例子。 並且可以輕松地擴展以使類到屬性和元素的映射變得輕而易舉。