https://github.com/giovanni-venturelli/jvx-multiselect
A multipurpose - multiselect material web component which manages both synchronous and asynchronous selections.
https://github.com/giovanni-venturelli/jvx-multiselect
asynchronous material-design multi-select select web-components
Last synced: over 1 year ago
JSON representation
A multipurpose - multiselect material web component which manages both synchronous and asynchronous selections.
- Host: GitHub
- URL: https://github.com/giovanni-venturelli/jvx-multiselect
- Owner: giovanni-venturelli
- Created: 2020-09-29T15:10:20.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2020-10-06T15:05:22.000Z (over 5 years ago)
- Last Synced: 2024-10-24T10:06:50.660Z (over 1 year ago)
- Topics: asynchronous, material-design, multi-select, select, web-components
- Language: Vue
- Homepage:
- Size: 4.73 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Jvx-multiselect
Jvx-multiselect is a multipurpose - multiselect material web component which manages both synchronous and asynchronous selections.
## Todo
* Import vuetify style in the web component
## Build
```npm
npm install
npm run build-wc
```
## Installation & use
Use `npm link` to include jvx-multiselect in your project.
#### Angular10
###### *app.module.ts*
```ts
import { BrowserModule } from '@angular/platform-browser';
import {CUSTOM_ELEMENTS_SCHEMA, NgModule} from '@angular/core';
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule
],
providers: [],
bootstrap: [AppComponent],
schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
})
export class AppModule { }
```
###### *custom.component.ts*
```ts
import {Component} from '@angular/core';
import 'jvx-multiselect';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'angular-test';
options = [
{value: 0, text: 'Val 0'},
{value: 1, text: 'Val 1'},
{value: 2, text: 'Val 2'}
];
}
```
###### *custom.component.html*
```angular2html
```