ng bootstrap 手风琴无法添加向下箭头图标

Question

谁知道如何为 icon-arrow-down

我添加了这个 <i class="icon-arrow-down"></i> 但没有用

这是我的代码

<ngb-accordion #acc="ngbAccordion">
  <ngb-panel title="Task Tyeps (5)">  <i class="icon-arrow-down"></i>
    <ng-template ngbPanelContent>
   text.....
    </ng-template>
  </ngb-panel>
</ngb-accordion>

我尝试这样添加

谢谢

Answer 1

我不知道你的完整代码，但我猜你没有导入 Font Awesome。 "icon-arrow-down" 需要 Font Awesome 3.2.1 库，请尝试在页面的 <head> 部分添加以下内容

<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">

Answer 2

终于解决了我的问题

<ngb-accordion class="range-accordion">
    <ngb-panel>
        <ng-template ngbPanelTitle>
            <div class="d-flex justify-content-between">
                <div class="d-flex" style="font-weight: bold; color: #1c2128;">Checklist items</div>
                <div class="d-flex"><i class="icon-arrow-down"></i></div>
            </div>
        </ng-template>
        <ng-template ngbPanelContent>
            text
        </ng-template>
    </ngb-panel>
</ngb-accordion>

根据我们的要求添加一些自定义样式。

.range-accordion .btn-link {
    width: 100%;
    text-decoration-line: none;
}

ng bootstrap 手风琴无法添加向下箭头图标

ng bootstrap Accordion to cant add arrow down icon

css

accordion

ng-bootstrap

angular