Ir para o conteúdo
5 recursos obrigatórios do Angular Grid Row e como usá-los

5 recursos obrigatórios do Angular Grid Row e como usá-los

Quais são os recursos obrigatórios do Angular Grid Row a serem considerados ao trabalhar em seu próximo projeto? Neste artigo, falamos sobre os 5 principais. Saiba mais.

3min de leitura

Trabalhar com big data não é tão fácil. Cada componente deve fornecer os meios e ferramentas para realmente dar sentido aos dados que serão usados pelo usuário final. É aqui que componentes como o Ignite UI for Angular Grid e os recursos avançados de linha provam ser úteis.

Análise de dados com seleção

Em resumo - O que é o recurso de linha de grade em Angular?

Os recursos de linha de grade referem-se às funcionalidades e recursos que uma determinada biblioteca de interface do usuário Angular (como Ignite UI for Angular biblioteca, por exemplo) fornece para que os desenvolvedores possam gerenciar e manipular linhas dentro de um componente de grade de forma eficiente e fácil.

Aqui estão meus 5 principais recursos do Angular Grid Row que você deve ter:

Seleção de linha

Com a seleção de linha em Ignite UI for Angular, uma coluna seletora de linha precede todas as outras colunas dentro da linha. Quando um usuário clica no seletor de linha, a linha será selecionada ou desmarcada, permitindo que o usuário selecione várias linhas de dados.

O exemplo abaixo demonstra os três tipos de comportamento de seleção de linha do Grid. Use os botões abaixo para ativar cada um dos modos de seleção disponíveis. Uma breve descrição será fornecida em cada interação do botão por meio de uma caixa de mensagem de lanchonete. Use o botão de alternância para ocultar ou mostrar a caixa de seleção do seletor de linha.

Exemplo de seleção de linha

Layout de várias linhas

O Layout de Várias Linhas estende os recursos de renderização do igxGridComponent. O recurso permite dividir um único registro de dados em várias linhas visíveis.

Layout de várias linhas

Ações de interface do usuário de linha

O componente de grade no Ignite UI for Angular fornece a capacidade de usar o ActionStrip e utilizar o CRUD para componentes de linha/célula e fixação de linha. O componente Faixa de ação pode hospedar controles de interface do usuário predefinidos para essas operações.

Exemplo de ações de linha

Fixação de linha

Uma ou várias linhas podem ser fixadas na parte superior ou inferior da grade da interface do usuário do Angular. A fixação de linha no Ignite UI for Angular permite que os usuários finais fixem linhas em uma ordem específica, duplicando-as em uma área especial e visível, mesmo quando rolam a grade verticalmente. A grade da interface do usuário do material tem uma interface do usuário de fixação de linha interna, que é ativada inicializando um componente igxActionStrip no contexto da grade. Além disso, você pode definir a interface do usuário personalizada e alterar o estado do pino das linhas por meio da API de fixação de linha.
Fixação de linha

Arrastar linha

O arrastar de linha fornece aos usuários uma alça de arrastar de linha com a qual eles podem iniciar o arrastar de uma linha.

Exemplo de arrastamento de linha

Embrulhar

Existem diferentes recursos e funcionalidades de linha de grade em Angular bibliotecas de interface do usuário disponíveis no mercado. Mas, para mim, os recursos obrigatórios são precisamente a seleção de linhas, o layout de várias linhas, as ações da interface do usuário da função, a fixação de linhas e o arrasto de linhas. Com eles, os usuários podem gerenciar e manipular dados tabulares com mais facilidade.

Se precisar de mais detalhes, recomendamos que você confira nosso:

Para experimentar tudo, visite o portal do cliente e obtenha a versão mais recente. Como de costume, estamos sempre ansiosos para receber seus comentários e ouvir o que você deseja adicionar ou recomendar. Então, por favor, envie-me um e-mail para zkolev@infragistics.com e deixe-me saber como podemos ajudá-lo a continuar agregando valor aos seus clientes com Infragistics.

Ignite UI for Angular benefícios

Solicite uma demonstração