NGB-Bootstraip ToolTip и PopOver не прокручивают в модальном - PullRequest
Новая
       36

NGB-Bootstraip ToolTip и PopOver не прокручивают в модальном

0 голосов
/ 30 октября 2018

Я использую ngb-bootstrap для Angluar 6 с простым модальным отображением таблицы. Я хочу использовать tooltip или popover для отображения дополнительной информации о строке. Модал / таблица имеет полосу прокрутки для таблиц длиннее модальных.

tooltip и / или popover правильно отображаются для первых нескольких строк, но при прокрутке вниз эти функции скрыты и отображаются только при прокрутке таблицы вверх.

Таблица в модале выглядит так: 

<div class="modal-body  my-scroll-div4">
    <table class="table table-hover table-bordered">
        <thead>
        <tr>
            <th>PUNum</th>
            <th>pvNum &#47; Child</th>
            <th>Detail</th>
        </tr>
        </thead>
        <tr *ngFor="let version of compatDetail">
            <td>{{version.plPUNum}}</td>
            <td>{{version.pvNum}} &#47; {{version.pvNumChild}}</td>
            <td>
                <table>
                    <tr
                            [ngbPopover]='getTip(matchData.matchFlag)'
                            *ngFor="let matchData of makeArray(version.plMatchList)"
                    >
                        <td>{{matchData.pvNumPri}}</td>
                        <td>{{matchData.pvNumSec}}</td>
                        <td>{{matchData.matchFlag}}</td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</div>

Функция makeArray просто берет объект и возвращает массив. tooltip | popover функция: 

getTip(e) {     // "DeFlag' e to values
    let _retStr     = '';
    let _lE: number = e;
    for ( let _i = (this._systemFlags.length - 1); _i >= 0; _i-- ) {
        if (this._systemFlags[_i][1]['scValue'] <= _lE) {
            if (_retStr === '') { _retStr = this._systemFlags[_i][1]['scSName']} else
            { _retStr += ' | ' + this._systemFlags[_i][1]['scSName'];}
            _lE -= this._systemFlags[_i][1]['scValue'];
        }
    }
    if (_retStr === '') {
        _retStr = this._systemFlags[0][1]['scSName'];
    }
    return _retStr;
}

Я попытался поместить tooltip|popover в <td> и создать <div> вокруг всех <td> элементов с одинаковым результатом.

Продолжительность: 

Angular CLI: 6.2.5
Node: 8.12.0
OS: linux x64
Angular: 6.1.10
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.6.8
@angular-devkit/build-angular      0.6.8
@angular-devkit/build-ng-packagr   0.6.8
@angular-devkit/build-optimizer    0.6.8
@angular-devkit/core               0.8.5
@angular-devkit/schematics         0.8.5
@angular/cli                       6.2.5
@ngtools/json-schema               1.1.0
@ngtools/webpack                   6.0.8
@schematics/angular                0.8.5
@schematics/update                 0.8.5
ng-packagr                         3.0.6
rxjs                               6.3.3
typescript                         2.7.2
webpack                            4.8.3

$ yarn list --pattern bootstrap
yarn list v1.10.1
├─ @ng-bootstrap/ng-bootstrap@3.3.0
└─ bootstrap@4.1.3
Done in 1.33s.

Как всегда, спасибо за вашу любезную помощь.

...