@wobius/folder

Easily add folder navigation to your Angular + Material project.

Stats

stars 🌟issues ⚠️updated 🛠created 🐣size 🏋️‍♀️
@wobius/folder
Minified + gzip package size for @wobius/folder in KB

Readme

Easily add folder navigation to your Angular + Material project.

Import the Module:

import { FolderModule } from '@wobius/folder'

@NgModule({
    imports: [ FolderModule ]
})

Usage:

import { Component } from '@angular/core'
import { FolderDB } from '@wobius/folder'

@Component({
    template: `
        <button mat-raised-button (click)="fid.onNewFolder()">Add Folder</button>
        <folder-nav [settings]="fset" (walked)="cwd=$event" (created)="onNewFolder($event)" #fid></folder-nav>
        <div *ngFor="let f of folderList | folder : cwd.key : fset.group">
            <span (click)="fid.onWalk(f)">{{ f.name }}</span>
        </div>
    `
})
export class MyComponent {
    folderList:FolderDB[] = []
    fset = {title:'My Pages', group:'page'}
    cwd:FolderDB = {key:'', abspath:''}

    onNewFolder(f:FolderDB) {
        this.folderList.push(f)
        this.folderList = this.folderList.slice()
    }
}

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.