Bootstrap 导航栏上重复的 FontAwesome 图标答案

【问题标题】：Duplicated FontAwesome Icons on Bootstrap NavbarBootstrap 导航栏上重复的 FontAwesome 图标
【发布时间】：2013-11-20 23:39:21
【问题描述】：

我目前正在使用我的导航栏，但我对此感到困惑：

http://i.stack.imgur.com/f0pBR.png

如您所见，每个图标都有一个重复的图标...

我正在使用 Bootstrap 2.3.2 和 FontAwesome 4.0.3

<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">

对于我使用 ng-repeat 属性 (AngularJS) ng-repeat 的标题：

<!-- HTML -->
<ul class="nav">
    <li ng-repeat="tab in tabs" ng-class="{active:isActive(tab.href)}">
        <a href="#{{tab.href}}">
            {{tab.label}} <i ng-class="tab.ico">
        </a>
    </li>
</ul>

/* JS Ctrl */
$scope.tabs = [{label: "Title 1", href: "/Page1", ico: "fa fa-trophy"},
               {label: "Title 2", href: "/Page2", ico: "fa fa-globe"},
               {label: "Title 3", href: "/Page3", ico: "fa fa-whatever"},
               {label: "Title 4", href: "/Page4", ico: "fa fa-rt"}];

我不知道我做错了什么。有什么线索吗？

谢谢。

事实上，感谢 Jon Kartago Lamida，问题似乎来自 元素并用元素替换它解决了它。

【问题讨论】：

标签： html angularjs twitter-bootstrap font-awesome twitter-bootstrap-2

【解决方案1】：

老实说，我不知道什么是 html 元素。但是当我用替换它时，它似乎有效。它不再复制图标。请在这里查看http://plnkr.co/edit/Ydz3Cnuc0tnRtecFR3K5

【讨论】：