как сделать кладку только после полной загрузки htm в angular 7 - PullRequest
0 голосов
/ 23 июня 2019

Я использую Angular 7 и использую кладку и загруженные изображения js. После вызова API для данных как:

Promise.all( [ this.accountService.getOrgTagType( params ) ] ).then( result => {
   /* do work here */
   this.ngAfterViewInit();
});

Я показываю кладку в ngAfterViewInit () с некоторым таймаутом, но кладка не работает идеально.

ngAfterViewInit() {
        setTimeout (
            () => {
                if ( document.querySelector( '.organisations-grid' ) ) {
                    var orgElem = document.querySelector( '.organisations-grid' );
                    var orgElemmsnry = new Masonry( orgElem, {
                        // options
                        itemSelector: '.organisations-grid-item',
                        columnWidth: '.grid-sizer-3',
                        horizontalOrder: true,
                        percentPosition: true,
                    });

                    imagesLoaded( orgElem ).on( 'progress', function() {
                        // layout Masonry after each image loads
                        orgElemmsnry.layout();
                    });
                }
            }, 300
        );
    }

Как безошибочно показать кладку на Angular? Любые предложения / советы приветствуются.

...