Как использовать angular flex-layout в angular 18
У меня есть большое приложение, созданное на Angular 17, которое я недавно обновил до Angular 18. Поскольку пакеты flex-layout официально не поддерживают Angular 18, я переопределил их, чтобы npm install заработало.
Однако я столкнулся с проблемой: при изменении размера страниц некоторые части страницы становятся невидимыми.
Also in code, am using it like this:
<div class = "wrapper" fxFlex = "grow" fxLayout = "row">
<fl-sidebar></fl-sidebar>
<div #scrollContainer class = "main-container" fxFlex>
<router-outlet #o = "outlet" (activate) = "onActivate()"></router-outlet>
</div>
</div>
Учитывая размер моего проекта, как лучше и проще всего обеспечить flex-layout правильную работу в Angular 18?
И каков желаемый результат? Потому что экран кажется недостаточно большим, чтобы вместить все. Поэтому в какой-то момент я ожидаю горизонтального перелива.
Ответы 1
Команда Angular прекратила публикацию новых выпусков этого проекта. Подробнее см. Прощай, Flex Layout . Если у вас большой проект и вам все еще нужно использовать Flex Layout с последней версией Angular, рассмотрите возможность перехода на @ngbracket/ngx-layout. Чтобы обновить текущий проект, просто измените импорт следующим образом:
//remove all @angular/flex-layout
import { FlexLayoutModule } from '@angular/flex-layout'; // not supported
// replace it by @ngbracket/ngx-layout
import { FlexLayoutModule } from '@ngbracket/ngx-layout';
Прежде всего, экспериментальный пакет
@angular/flex-layoutустарел с версии 15 blog.angular.dev/modern-css-in-angular-layouts-4a259dca9127 поэтому переход на что-то другое будет лучшим способом на будущее. А при этом нет ли ошибок в консоли?