Visão geral das diretivas do Angular Layout Manager

    As diretivas de layout do Ignite UI for Angular permitem que os desenvolvedores especifiquem uma direção de layout para quaisquer filhos do contêiner ao qual ele é aplicado. O layout pode fluir vertical ou horizontalmente, com controles para quebra, justificação e alinhamento.

    Angular Layout Manager Example

    Usage

    Use a diretiva igxLayout em um elemento de contêiner para especificar a direção do layout para seus filhos:

    Horizontally with Row direction

    Use igxLayoutDir="row".

    Vertically with Column direction

    Use igxLayoutDir="column".

    Note

    Ordem reversa usando igxLayoutReverse="true".

    Customize the order of the elements

    Personalize a ordem do elemento usando igxFlexOrder.

    Change element spacing

    Use igxLayoutJustify="space-between | space-around".

    Position elements along the main axis

    Use igxLayoutJustify="flex-start | center | flex-end" para especificar a posição dos elementos ao longo do eixo principal de acordo com suas preferências.

    Position elements along the cross axis

    Use igxLayoutItemAlign="flex-start | center | flex-end" para especificar a posição dos elementos ao longo do eixo transversal de acordo com suas preferências.

    You can also wrap elements

    Use igxLayoutWrap="wrap".

    Note

    A diretiva igxLayout afeta as direções de fluxo para os filhos imediatos desse contêiner.

    Nesting

    Use a diretiva igxFlex para elementos dentro de um pai igxLayout para controlar propriedades específicas do flexbox.

    API References