Free & Open-Source Angular Data Grid (Grid Lite)

    El Ignite UI for Angular Grid Lite es una red de datos Angular ligera, de alto rendimiento, gratuita de usar, de código abierto y diseñada para aplicaciones Angular modernas.

    Esta red de datos de Angular libre es una red de datos JavaScript de código abierto construida como un componente web, lo que significa que puedes usarla sin dependencias con o sin un framework web. Ofrece funcionalidad esencial de visualización de datos con una sobrecarga mínima y el rendimiento que los usuarios esperan. El Angular Grid Lite está diseñado para desarrolladores que necesitan una presentación rápida y ligera de los datos.

    What You Get with our Free Angular Data Grid

    Nuestro Angular gratuito y de código abierto Grid Lite incluye las siguientes funciones basadas en columnas: ordenación, filtrado, ocultación, redimensionamiento y una variedad de tipos de datos predefinidos. El rendimiento es ultra rápido gracias al uso de virtualización por filas. Además, el componente soporta navegación con teclado y tematización a través del Ignite UI Theming Framework.

    Angular soporta elementos personalizados, así que puedes usar Grid Lite con facilidad.

    Grid Lite in Action

    Installation and Setup

    Para usar Grid Lite en tu aplicación puedes importarlo directamente desde este puntoigniteui-angular de entrada. Pero también necesitas instalar eligniteui-angular/grids/lite paquete que alimenta la interfaz. IgxGridLiteComponent proporciona Angular enlaces (eventos, plantillas, DI, detección de cambios, pipes), mientras que la interfaz visual grid lite se renderiza porigniteui-grid-lite. Instalar ambos garantiza que la grid lite se comporte de forma nativa en Angular aprovechando la interfaz completaigniteui-grid-lite.igniteui-grid-lite

    npm install igniteui-grid-lite
    

    Antes de iniciar la aplicación, asegúrate de importar y pasar el esquema personalizado de elementos que se muestra a continuación.

    // app.component.ts
    
    import { Component } from '@angular/core';
    import { IgxGridLiteComponent, IgxGridLiteColumnComponent } from 'igniteui-angular/grids/lite';
    
    @Component({
      ...
      imports: [IgxGridLiteComponent, IgxGridLiteColumnComponent],
      template: `
        <div>
          <igx-grid-lite [data]="products">
            <igx-grid-lite-column field="id" header="ID" dataType="number"></igx-grid-lite-column>
            <igx-grid-lite-column field="name" header="Name"></igx-grid-lite-column>
            <!-- Additional columns -->
          </igx-grid-lite>
        </div>
      `
    })
    export class AppComponent {
      products: Products[] = [...];
    }
    

    Características

    Performance Built In

    Cuando utilizas nuestra red de datos Angular gratis, puedes implementar virtualización a nivel de fila. Esto te permite renderizar cantidades ilimitadas de datos con desplazamiento suave.

    Automatic Column Types

    Los tipos de columna se generan automáticamente en función de tu fuente de datos con filtrado integrado según el tipo de columna.

    Custom Column Templates

    Con nuestro control de código abierto Angular red de datos también puedes ofrecer cualquier tipo de experiencia de usuario con plantillas de columnas. ¡Cualquier cosa que imagines puede renderizarse en una columna de cuadrícula!

    Interactive Features

    Todas las funciones interactivas principales que tus usuarios esperan, como filtrado de columnas, ocultación de columnas, redimensionamiento de columnas, ordenación de columnas y más.

    Beautiful UX & Branding

    Esta cuadrícula de datos Angular gratuita (Grid Lite) incluye soporte integrado para temas para Bootstrap, Material y Fluent, además de infinitas opciones de marca en paletas de colores, tipografías, elevación, densidad de pantalla y más.

    Rich Keyboard Navigation

    La navegación completa de teclado al estilo Excel ofrece al usuario la experiencia que espera con una navegación de teclado de alto rendimiento en el clavado.

    Is Grid Lite a Free & Open-Source Angular Data Grid?

    Sí. Ignite UI Grid Lite es una red de datos de Angular gratuita, de código abierto, publicada bajo la licencia del MIT. Puedes usarla en proyectos comerciales o personales sin costes de licencia. Forma parte de nuestra iniciativa para hacer Ignite UI más abierto, transparente y accesible.

    • MIT-licensed

    • Gratis para uso comercial

    • Community-driven development

    • Sin filtro de características

    Sin embargo, si tu proyecto escala y crece en complejidad y funcionalidad, y necesitas una aplicación de nivel empresarial, contamos con una estrategia de actualización fluida. Esto hará que la transición de la red de datos de Angular gratuita (Grid Lite) a la avanzada y completa Red de Datos sea más sencilla y rápida.

    Angular soporta elementos personalizados, así que puedes usar Grid Lite con facilidad.