-
Notifications
You must be signed in to change notification settings - Fork 13
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #6 from plantain-00/update-for-angular
- Loading branch information
Showing
24 changed files
with
1,982 additions
and
1,303 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -65,3 +65,6 @@ dist | |
| !*.config.js | ||
| !**/*-*.js | ||
| !**/*-*.css | ||
|
|
||
| # Netbeans | ||
| /nbproject/ | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,6 +1,6 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="UTF-8"> | ||
| <link rel="stylesheet" href="../index.bundle-bf3a9ac354f50f05d52e53a111806c2a.css" crossOrigin="anonymous" integrity="sha256-FkSI4EGymi3Kmxa3MJc/bdoGRpQikI8ww27pLimkIc0=" /> | ||
| <link rel="stylesheet" href="../index.bundle-33b91cc97d952c0c4ba0758646e581b8.css" crossOrigin="anonymous" integrity="sha256-GqYE89fIjCzZU3fhgU7DNMF1rINfUtQCrblfc6Vnv08=" /> | ||
| <a class="github-fork-ribbon right-bottom" href="https://github.com/plantain-00/select2-component" title="Fork me on GitHub" target="_blank">Fork me on GitHub</a> | ||
| <app></app> | ||
| <script src="./index.bundle-b2f30b598bbfb68653d656611d74be26.js" crossOrigin="anonymous" integrity="sha256-NL6+owzxwkwNyS+lYuv+rsjyCQmD0lof25ihjzT8b7E="></script> | ||
| <script src="./index.bundle-1256acc2f44df637218ec81646b83ff9.js" crossOrigin="anonymous" integrity="sha256-XbRwmKd39enzuTpNXnxv1RCx9SHUhoVxqTG2UnqoH2o="></script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,26 @@ | ||
| import { NgModule, ApplicationRef } from "@angular/core"; | ||
| import { CommonModule } from "@angular/common"; | ||
| import { BrowserModule } from "@angular/platform-browser"; | ||
| import { FormsModule, ReactiveFormsModule } from "@angular/forms"; | ||
|
|
||
| import { Select2Module } from "../../dist/angular"; | ||
| import { MainComponent } from "./main"; | ||
|
|
||
| @NgModule({ | ||
| declarations: [ | ||
| MainComponent, | ||
| ], | ||
| imports: [ | ||
| CommonModule, | ||
| BrowserModule, | ||
| FormsModule, | ||
| ReactiveFormsModule, | ||
| Select2Module, | ||
| ], | ||
| bootstrap: [MainComponent], | ||
| }) | ||
| export class MainModule { | ||
| constructor( | ||
| public appRef: ApplicationRef, | ||
| ) { } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,156 @@ | ||
| import { Component, ChangeDetectionStrategy } from "@angular/core"; | ||
| import { Validators, FormControl, FormBuilder, FormGroup } from "@angular/forms"; | ||
|
|
||
| import { Select2Option, Select2Data } from "../../dist/angular"; | ||
| import { data1, data2, data3, data5 } from "../common"; | ||
|
|
||
| @Component({ | ||
| selector: "app", | ||
| changeDetection: ChangeDetectionStrategy.OnPush, | ||
| template: ` | ||
| <div style="width: 500px;"> | ||
| <a href="https://github.com/plantain-00/select2-component/tree/master/demo/angular/index.ts" target="_blank">the source code of the demo</a> | ||
| <h2>Standard</h2> | ||
| <h3>options in group ({{value1}})</h3> | ||
| <select2 [data]="data1" | ||
| [value]="value1" | ||
| (update)="update1($event)"> | ||
| </select2> | ||
| <h3>options ({{value2}})</h3> | ||
| <select2 [data]="data2" | ||
| [value]="value2" | ||
| (update)="update2($event)"> | ||
| </select2> | ||
| <h3>less options ({{value3}})</h3> | ||
| <select2 [data]="data3" | ||
| [value]="value3" | ||
| (update)="update3($event)"> | ||
| </select2> | ||
| <h3>disabled ({{value4}})</h3> | ||
| <select2 [data]="data4" | ||
| [value]="value4" | ||
| [disabled]="true"> | ||
| </select2> | ||
| <h3>hide search box ({{value5}})</h3> | ||
| <select2 [data]="data5" | ||
| [value]="value5" | ||
| [minCountForSearch]="minCountForSearch" | ||
| (update)="update5($event)"> | ||
| </select2> | ||
| <h3>placeholder ({{value6}})</h3> | ||
| <select2 [data]="data6" | ||
| placeholder="select an item" | ||
| (update)="update6($event)"> | ||
| </select2> | ||
| <h3>open and search event ({{value7}})</h3> | ||
| <select2 [data]="data7" | ||
| customSearchEnabled="true" | ||
| (open)="open7()" | ||
| (search)="search7($event)" | ||
| (update)="update7($event)"> | ||
| </select2> | ||
| <h3>multiple ({{value9}})</h3> | ||
| <select2 [data]="data9" | ||
| [value]="value9" | ||
| multiple="true" | ||
| (update)="update9($event)"> | ||
| </select2> | ||
| <h3>form binding ({{value10}})</h3> | ||
| <form [formGroup]="ctrlForm"> | ||
| <select2 | ||
| [(ngModel)]="value10" | ||
| [data]="data10" | ||
| formControlName="test10" | ||
| placeholder="Select a state" | ||
| material | ||
| ></select2> | ||
| <button (click)="reset10()">reset</button> | ||
| <button (click)="change10()">Utah</button> | ||
| </form> | ||
| <h3>material style ({{value11}})</h3> | ||
| <select2 [data]="data11" | ||
| [value]="value11" | ||
| (update)="update11($event)" | ||
| material> | ||
| </select2> | ||
| </div> | ||
| `, | ||
| }) | ||
| export class MainComponent { | ||
| data1 = data1; | ||
| data2 = data2; | ||
| data3 = data3; | ||
| data4: Select2Data = JSON.parse(JSON.stringify(data3)); | ||
| data5 = data5; | ||
| data6: Select2Data = JSON.parse(JSON.stringify(data3)); | ||
| data7: Select2Option[] = []; | ||
| data9: Select2Data = JSON.parse(JSON.stringify(data1)); | ||
| data10: Select2Data = JSON.parse(JSON.stringify(data1)); | ||
| data11: Select2Data = JSON.parse(JSON.stringify(data1)); | ||
|
|
||
| minCountForSearch = Infinity; | ||
|
|
||
| ctrlForm: FormGroup; | ||
|
|
||
| value1 = "CA"; | ||
| value2 = "CA"; | ||
| value3 = "foo"; | ||
| value4 = "bar"; | ||
| value5 = "foo3"; | ||
| value6 = ""; | ||
| value7 = ""; | ||
| value9: string[] = []; | ||
| value10 = ""; | ||
| value11 = "CA"; | ||
|
|
||
| constructor(private fb: FormBuilder) { | ||
| this.ctrlForm = this.fb.group({ | ||
| test10: new FormControl(null, Validators.required), | ||
| }); | ||
| } | ||
|
|
||
| update1(value: string) { | ||
| this.value1 = value; | ||
| } | ||
| update2(value: string) { | ||
| this.value2 = value; | ||
| } | ||
| update3(value: string) { | ||
| this.value3 = value; | ||
| } | ||
| update5(value: string) { | ||
| this.value5 = value; | ||
| } | ||
| update6(value: string) { | ||
| this.value6 = value; | ||
| } | ||
| open7() { | ||
| this.data7 = JSON.parse(JSON.stringify(data2)); | ||
| } | ||
| update7(value: string) { | ||
| this.value7 = value; | ||
| } | ||
| search7(text: string) { | ||
| this.data7 = text | ||
| ? (JSON.parse(JSON.stringify(data2)) as Select2Option[]).filter(option => option.label.toLowerCase().indexOf(text.toLowerCase()) > -1) | ||
| : JSON.parse(JSON.stringify(data2)); | ||
| } | ||
| update9(value: string[]) { | ||
| this.value9 = value; | ||
| } | ||
| reset10() { | ||
| const test10 = this.ctrlForm.get("test10"); | ||
| if (test10) { | ||
| test10.reset(); | ||
| } | ||
| } | ||
| change10() { | ||
| const test10 = this.ctrlForm.get("test10"); | ||
| if (test10) { | ||
| test10.setValue("UT"); | ||
| } | ||
| } | ||
| update11(value: string) { | ||
| this.value11 = value; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,9 +1,9 @@ | ||
| { | ||
| "angularIndexBundleJs": "771 kB 193 kB", | ||
| "reactIndexBundleJs": "164 kB 48.5 kB", | ||
| "vueIndexBundleJs": "102 kB 34.4 kB", | ||
| "indexBundleCss": "10.4 kB 1.93 kB", | ||
| "demoAngularIndexHtml": "550 B 401 B", | ||
| "demoReactIndexHtml": "565 B 409 B", | ||
| "angularIndexBundleJs": "959 kB 228 kB", | ||
| "reactIndexBundleJs": "166 kB 50.1 kB", | ||
| "vueIndexBundleJs": "103 kB 36 kB", | ||
| "indexBundleCss": "15.6 kB 2.64 kB", | ||
| "demoAngularIndexHtml": "550 B 404 B", | ||
| "demoReactIndexHtml": "565 B 410 B", | ||
| "demoVueIndexHtml": "565 B 410 B" | ||
| } |
Oops, something went wrong.