Angular multiselect component for web application. Easy to integrate and use.

Overview

Angular multiselect

Angular multiselect component for web application. Easy to integrate and use.

Getting started

Installation

npm install ngx-selects

And then include it in your module:

import { NgMultiSelectDropDownModule } from 'ngx-selects';
// ...

@NgModule({
  imports: [
    NgxSelectsModule
    // ...
  ]
  // ...
})
export class AppModule {}

Usage

">
.html

import { Component } from '@angular/core';
import {OptionData} from './lib/ngx-selects/ngx-selects.interface';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'ngx-selects-app';
  // demo
  data: OptionData[] = [
    {
      id: 1,
      text: 'Family'
    },
    {
      id: 2,
      text: 'Family in Law'
    },
    {
      id: 3,
      text: 'Co-workers'
    },
    {
      id: 4,
      text: 'Hockey club'
    },
    {
      id: 5,
      text: 'Startup Investing. Simplified.'
    },
    {
      id: 6,
      text: 'Swiss Embassy'
    },
    {
      id: 7,
      text: 'Zurich Hike & Outdoor. 16,170 InternationalOutdoorEnthusiasts.'
    },
    {
      id: 8,
      text: 'Family'
    },
    {
      id: 9,
      text: 'Family in Law'
    },
    {
      id: 10,
      text: 'Co-workers'
    },
    {
      id: 11,
      text: 'Hockey club'
    },
    {
      id: 12,
      text: 'Startup Investing. Simplified.'
    },
    {
      id: 13,
      text: 'Swiss Embassy'
    },
    {
      id: 14,
      text: 'Zurich Hike & Outdoor. 16,170 InternationalOutdoorEnthusiasts.'
    }
  ]

  dataSelected: OptionData[]  = [];
}

You might also like...

A set of UI components for use with Angular 2 and Bootstrap 4.

#Fuel-UI A set of UI components for use with Angular 2 and Bootstrap 4. See Fuel-UI homepage for live demo and documentation. ##Dependencies Node Gulp

Jul 4, 2022

Petite application de décomposition d'un nombre en produits de facteurs premiers sur Angular

Factprem This project was generated with Angular CLI version 13.0.3. Development server Run ng serve for a dev server. Navigate to http://localhost:42

Jan 13, 2022

Heavily inspired by Angular Forms, this package provides utilities for complex Model-driven form management in Lit-based Web Components.

Heavily inspired by Angular Forms, this package provides utilities for complex Model-driven form management in Lit-based Web Components.

Dec 9, 2022

Clon de la tienda online de Mercadona que sirve como práctica de una aplicación web completa utilizando Angular

tienda-online-angular-alumnos Clon de la tienda online de Mercadona que sirve como práctica de una aplicación web completa utilizando Angular TiendaOn

Mar 22, 2022

An enterprise-class UI components based on At UI Design and Angular. 🚀 🚀 🚀

An enterprise-class UI components based on At UI Design and Angular. 🚀 🚀 🚀

Dec 16, 2022

📦 SVGs, fast and developer friendly in Angular

📦 SVGs, fast and developer friendly in Angular

View settings all icons fixed size e.g. 30px button to align all icons distributes button to align all icons onscreen button to align all icons offscr

Nov 28, 2022

NGX-YOUI is a Highly customizable library of Angular UI components for content and styles

NGX-YOUI NGX-YOUI is an Angular UI Library that can be highly customized with content and styles. You can easily integrate with other CSS frameworks a

Nov 29, 2022

Directives, utils, and events for working with angular zoneless

az-zoneless A set of directive and utilities to manage an angular zoneless app. Using this library you can go completly zoneless and still support 3rd

Dec 15, 2022

Monorepo for all the tooling related to using ESLint with Angular

Monorepo for all the tooling related to using ESLint with Angular

Angular ESLint Monorepo for all the tooling which enables ESLint to lint Angular projects

Dec 29, 2022
Owner
Dinh The Loc
Dinh The Loc
The best way to quickly integrate Bootstrap 5 Bootstrap 4 or Bootstrap 3 Components with Angular

ngx-bootstrap The best way to quickly integrate Bootstrap 5 Bootstrap 4 or Bootstrap 3 Components with Angular Links Documentation Release Notes Slack

Valor Software 5.4k Jan 8, 2023
An example application that uses file-based routing with Angular, Analog, Vite with the Angular Router

Angular, Vite, and File-based routes This is an example application that uses Angular, Analog, and Vite for file-based routing. Routes are places in t

Brandon 9 Sep 25, 2022
Angular Library workspace to creating and testing angular libraries

Library Workspace Run Locally Clone the project https://github.com/sametcelikbicak/library-workspace.git Go to the library project directory cd li

Samet ÇELİKBIÇAK 4 Nov 1, 2022
Clarity Angular is a scalable, accessible, customizable, open-source design system built for Angular.

Getting Started Clarity Angular is published as two npm packages: Contains the static styles for building HTML components. Contains the Angular compon

VMware Clarity 145 Dec 29, 2022
Component infrastructure and Material Design components for Angular

Official components for Angular The Angular team builds and maintains both common UI components and tools to help you build your own custom components

Angular 23.2k Jan 3, 2023
🚀 Style and Component Library for Angular

ngx-ui Component & Style Library for Angular by Swimlane. Installing npm i @swimlane/ngx-ui --S Install the project's peer depencencies (moment, codem

Swimlane 654 Dec 24, 2022
Angular UI Component Library based on Ant Design

NG-ZORRO An enterprise-class Angular UI component library based on Ant Design. English | 简体中文 ✨ Features An enterprise-class UI design system for Angu

NG-ZORRO 8.3k Jan 6, 2023
A component built in angular 13 which can generate an signature image in different fonts based on the selection.

AngularSignatureGenerator This project was generated with Angular CLI version 13.2.6. Development server Run ng serve for a dev server. Navigate to ht

Rohith P 4 Apr 26, 2022
Demo showing how to lazy load a component in Angular without routing!

WidgetDashboard This project was generated with Angular CLI version 13.2.6. Development server Run ng serve for a dev server. Navigate to http://local

Andy Bond 3 Mar 25, 2022
Angular component for filtering , contact list in alphabetical listing. Awesome Contact List

NgxContactList | Angular 13+ Angular component for filtering contents in alphabetical listing, using default or custom templates. Ideal to build conta

null 3 Sep 15, 2022