https://github.com/HesamKashefi/ngx-super-select-tree
https://github.com/HesamKashefi/ngx-super-select-tree
Last synced: about 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/HesamKashefi/ngx-super-select-tree
- Owner: HesamKashefi
- Created: 2024-09-17T06:12:45.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-02-12T05:09:41.000Z (9 months ago)
- Last Synced: 2025-09-01T14:59:10.964Z (about 2 months ago)
- Language: TypeScript
- Size: 235 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-angular - ngx-super-select-tree - A single/multiple choice drop down tree for Angular! (Third Party Components / Form Controls)
- fucking-awesome-angular - ngx-super-select-tree - A single/multiple choice drop down tree for Angular! (Third Party Components / Form Controls)
README
# NgxSuperSelectTree
This is a single/multiple choice drop down tree for Angular!
---
### [Live Demo on Stackblitz](https://stackblitz.com/edit/ngxsuperselecttree-demo)
---
## Features
* Multiple Selection Mode
* Angular Forms Support
* Dark Theme And Light Theme Support
## Build Status
| Build | NPM Publish |
|:---:|:---:|
| [](https://github.com/HesamKashefi/ngx-super-select-tree/actions/workflows/build.yml) | [](https://github.com/HesamKashefi/ngx-super-select-tree/actions/workflows/npm-publish.yml) |
## Install
```
> npm i ngx-super-select-tree
```
## Add Imports
Import `NgxSuperSelectTreeComponent` like this:
```
imports: [
NgxSuperSelectTreeComponent
]
```
## Usage
You can use it as simple as this:
```
```
in the .ts file:
```
export interface DataItem { id: number, name: string, parentId?: number };
@Component({
selector: 'app-root',
standalone: true,
imports: [
FormsModule,
ReactiveFormsModule,
RouterOutlet,
NgxSuperSelectTreeComponent
],
templateUrl: './app.component.html',
styleUrl: './app.component.scss'
})
export class AppComponent {
form = new FormGroup({
selectedValues: new FormControl([2])
});
dataSource: DataItem[] = [
{ id: 1, name: 'one' },
{ id: 2, name: 'two' },
{ id: 3, name: 'one - first', parentId: 1 },
{ id: 4, name: 'one - second', parentId: 1 },
{ id: 5, name: 'one - second - first', parentId: 4 },
{ id: 6, name: 'Three' },
];
onSelectedValuesChanged(selectedValues: any[]) {
console.log(selectedValues);
console.log(this.form.value);
}
}
```