Подскажите, может кто знает как решить проблему... Есть у меня div

Question

Подскажите, может кто знает как решить проблему... Есть у меня div

блок, у которого мне надо получить ширину через реф (nativeElement.offsetWidth). По идее это я должен делать в ngAfterViewInit. Но проблема в том, что только после прихода данных из сервера в этом блоке отображаются карточки и он приобретает свою реальную ширину. А до этого он пустой и я в итоге получаю ширину пустого блока, вместо полной((

Помогает вынести nativeElement.offsetWidth в ngAfterViewChecked, но это не решение, так как данный хук реагирует на каждый чих и вряд ли подходит...

Вопрос. Как получить ширину элемента уже только после того, как с бека придут данные?

#angular #frontend #javascript #programming #russian

0

12.07.2021

13 ответов

4 просмотра

Oleksandr 🤖 Автор вопроса

Volodimir Shkil
Если я правильно понял, у вас есть два тригера: 1....

ну получается что да, тригер должен быть - когда пришли данные и попали в темплейт. А в ngAfterViewInit ширину меряет еще до того, как пришли эти данные.

0

12.07.2021

Volodimir Shkil

Oleksandr 🤖
ну получается что да, тригер должен быть - когда п...

Так, ngAfterViewInit, происходит до того как данные попали в темплейт (в вашем случае), есть еще хук, отрабатывающий не 1 раз, а каждый раз после изменений View. Помойму это ngAfterViewChecked

0

12.07.2021

Oleksandr 🤖 Автор вопроса

Volodimir Shkil
Так, ngAfterViewInit, происходит до того как данн...

как я и написал, то ngAfterViewChecked решает проблему) но он реагирует на каждое движение, что тоже излишне... Пока я его и оставил.

0

12.07.2021

Oleg Safonov

Oleksandr 🤖
как я и написал, то ngAfterViewChecked решает проб...

Костыль - после получения данных воткнуть таймаут и в нем посмотреть ширину

0

12.07.2021

Oleksandr 🤖 Автор вопроса

Oleg Safonov
Костыль - после получения данных воткнуть таймаут ...

я думал, как вариант, но мне по рукам за такое все равно дадут при ревью кода

0

12.07.2021

Volodimir Shkil

Oleksandr 🤖
как я и написал, то ngAfterViewChecked решает проб...

Лучше всего сделать данные через rxjs, subject например, подписаться, проверить ширину, отписаться

0

12.07.2021

Oleksandr 🤖 Автор вопроса

Volodimir Shkil
Лучше всего сделать данные через rxjs, subject нап...

тоже в голове думал о какой-то подписке, но пока не достаточно опыта, чтобы реализовать))

0

12.07.2021

Volodimir Shkil

Oleksandr 🤖
тоже в голове думал о какой-то подписке, но пока н...

Самое время изучить, потом может быть лень. Конструкция будет максимально простая ;)

0

12.07.2021

Oleg Safonov

Oleksandr 🤖
я думал, как вариант, но мне по рукам за такое все...

А может обернуть содержимое в ещё один блок, который будет с ngIf и отображаться только когда данные есть? Тогда afterviewinit на вложенный блок должен нормально работать

0

12.07.2021

Oleksandr 🤖 Автор вопроса

Oleg Safonov
А может обернуть содержимое в ещё один блок, котор...

о... это интересное решение. Я просто думал, что будет underfined если блока нет. А может хук сработает повторно после отображения блока? Тогда попробую ща

0

12.07.2021

Oleg Safonov

Oleksandr 🤖
о... это интересное решение. Я просто думал, что б...

Нужно afterViewInit во вложенном только делать)

0

12.07.2021

Oleksandr 🤖 Автор вопроса

Oleg Safonov
Нужно afterViewInit во вложенном только делать)

ок, хотя я думал обойтись без вложенного)

0

12.07.2021

Volodimir Shkil · Accepted Answer

Volodimir Shkil

Если я правильно понял, у вас есть два тригера: 1. Данные с серва попали в компонент 2. Данные из пункта 1. попали в темплейти и отрисовались Использовать их для получения ширины после отрисовки

0

12.07.2021

169 похожих чатов

Подскажите, может кто знает как решить проблему... Есть у меня div

13 ответов

Похожие вопросы