Angular5 передает DOM-объект в ng-контент - PullRequest
Новая
       20

Angular5 передает DOM-объект в ng-контент

0 голосов
/ 18 мая 2018

Я новичок в сети.

Я хочу настроить полосу прокрутки по умолчанию в ag-grid.Я пытаюсь использовать ngx-scrollbar для этого.В источниках ngx-scrollbar я обнаружил, что ngx-scrollbar использует ng-content для переноса элементов ( ссылка на исходный файл github ).Если обернуть элемент ag-grid-angular , то прокрутка даже не отображается, потому что содержимое не переполняется ag-grid-angular содержимое, поскольку в div происходит переполнениес классом .ag-body-viewport , где используются стоковые скроллы.Для достижения необходимого эффекта я хочу передать элемент DOM с классом .ag-body-viewport в ng-content из ngx-scrollbar .Возможно ли это?

Подробнее здесь GitHub Issue , но я не использую Nice Scroll или Perfect Scrollbar

Я хочу использовать ngx-scrollbar потому что он имеет возможность настройки.

ОБНОВЛЕНИЕ

Я могу передать элемент DOM в ng-content , используя следующий синтаксис (agGridViewport является собственным элементом): 

<ng-scrollbar>
    {{ agGridViewport }}
<ng-scrollbar>

но он передает элемент как копию реального объекта DOM, но я хочу передать это как refence.

Теперь я получил UI как стиль стека:

[рендеринг настоящего ag-grid-angular]
[рендеринг ng-scrollbar с его содержимым]

Но это не то, что мне нужно.Также я получил плохой рендеринг с артефактами, и даже некоторые компоненты не появляются.Теперь я хочу попробовать использовать Renderer2 для помещения элемента ng-scrollbar между двумя элементами DOM в дереве ( .ag-body-viewport -wrapper и .ag-body-viewport).Но я думаю, что это очень плохая идея, потому что Renderer2 не имеет методов для размещения элементов между элементами DOM в дереве, и мой код будет очень простым и сложным :( Это должно быть похоже на внедрение.

1 Ответ

0 голосов
/ 21 мая 2018

Нет, я не могу делать инъекции в DOM с угловыми инструментами.Это плохая идея, и сейчас это невозможно.AgGrid не поддерживает настройку с помощью таких инструментов, как ngx-scrollbar , которые используют ng-content для упаковки компонентов и других элементов.Может быть лучше использовать другие инструменты, которые работают другим способом, или использовать настройку webkit, которая поддерживает не все веб-браузеры.

ОБНОВЛЕНИЕ

Также я пытаюсь использовать smooth-scrollbar ,Мне удалось получить лучший результат.Я привязываю его к элементу .ag-body-viewport .Он работает нормально, но при прокрутке только содержимого сетки без заголовка будьте осторожны. Плавная прокрутка * В строке 1014 * нет опций для горизонтальной и вертикальной полосы прокрутки в качестве разных единиц.Я знаю, как проблему можно решить.Вертикальная полоса прокрутки должна быть привязана к .ag-body-viewport , а горизонтальная полоса прокрутки должна быть привязана к .ag-root .Если вы можете найти полосу прокрутки, которая позволит вам сделать это, вы можете решить эту проблему.Может быть, я напишу специальный компонент для Angular в ближайшем будущем, а затем добавлю ссылку на этот ответ.Если вы делаете это быстрее, вы можете добавить себе ссылку или добавить ссылку на уже существующие пакеты.

...