ng-bootstrap аккордеонный щелчок не запускается в IE - PullRequest
Новая
       8

ng-bootstrap аккордеонный щелчок не запускается в IE

0 голосов
/ 03 января 2019

Я пытаюсь реализовать в моем приложении аккордеон ng-bootstrap 

<ngb-accordion [closeOthers]="true" activeIds="config-panel-one">
          <div *ngFor="let parent of parentsInfo;let j = index">
            <ngb-panel>
              <ng-template ngbPanelTitle>
                <div role="button" (click)="collapseExpand(parent)">
                    {{parent.folderName}}
                  <span class="fa fa-chevron-right" [ngClass]="{'fa-chevron-down':parent.isExpand, 'fa-chevron-right':!parent.isExpand}"></span>
               </div>
              </ng-template>
              <ng-template ngbPanelContent>
               {{parent.filename}}
              </ng-template>
            </ngb-panel><br>
          </div>
        </ngb-accordion>

Я просто пытаюсь установить шеврон на основе раскрытия против коллапса. Функция щелчка collapseExpand (parent) устанавливает флаг "isExpand"

enter image description here

Вышеуказанные функции работают нормально в браузере Chrome, но не работают в IE. Функция collapseExpand не запускается в Internet Explorer. Может ли кто-нибудь дать мне знать, как это исправить.

Я использую "@ ng-bootstrap / ng-bootstrap": "^ 4.0.0", угловой 7

1 Ответ

0 голосов
/ 04 января 2019

Проблема: в первую очередь ngb-accordian имеет кнопку по умолчанию, теперь из вашего кода, когда он (ngb-accordian) видит div под шаблоном, он просто игнорирует его и продвигается вперед.

Решение: Мы можем работать по-другому, используя кнопку вместо div, как показано ниже: 

 <ng-template ngbPanelTitle>
                <button class="btn btn-link"  (click)="collapseExpand(parent)">
                    {{parent.folderName}}
                  <span class="fa fa-chevron-right" [ngClass]="{'fa-chevron-down':parent.isExpand, 'fa-chevron-right':!parent.isExpand}"></span>
               </button>
              </ng-template>

Всего наилучшего.

...