### File

`src/app/shared/components/sidebar/sidebar.component.ts`

### Metadata

selector | `app-sidebar`
styleUrls | `sidebar.component.scss`
templateUrl | `./sidebar.component.html`

### Index

###### Properties
isActive showMenu
###### Methods
addExpandClass eventCalled

### Methods

addExpandClass
`addExpandClass(element: any)`
Defined in src/app/shared/components/sidebar/sidebar.component.ts:14
Parameters :
Name | Type | Optional | Description
element | `any` |  |
Returns : `void`

eventCalled
`eventCalled()`
Defined in src/app/shared/components/sidebar/sidebar.component.ts:11
Returns : `void`

### Properties

isActive
`isActive: ```
Default value : `false`
Defined in src/app/shared/components/sidebar/sidebar.component.ts:9

showMenu
`showMenu: ```
Defined in src/app/shared/components/sidebar/sidebar.component.ts:10

    import { Component } from '@angular/core';

    @Component({
        selector: 'app-sidebar',
        templateUrl: './sidebar.component.html',
        styleUrls: ['./sidebar.component.scss']
    })
    export class SidebarComponent {
        isActive = false;
        showMenu = '';
        eventCalled() {
            this.isActive = !this.isActive;
        }
        addExpandClass(element: any) {
            if (element === this.showMenu) {
                this.showMenu = '0';
            } else {
                this.showMenu = element;
            }
        }
    }

    <nav class="sidebar" [ngClass]="{sidebarPushRight: isActive}">
    	<ul class="list-group">
    		<a routerLink="/dashboard" [routerLinkActive]="['router-link-active']" class="list-group-item">
    			<i class="fa fa-fw fa-home"></i>&nbsp;{{ 'home' | translate }}
    		</a>

    		<div class="nested-menu">
    			<a class="list-group-item" (click)="addExpandClass('upload')">
    				<span>
    					<i class="fa fa-plus"></i>&nbsp; {{ 'analyze your text' | translate }}</span>
    			</a>
    			<li class="nested" [class.expand]="showMenu === 'upload'">
    				<ul class="submenu">
    					<li>
    						<a [routerLink]="['/text']" [routerLinkActive]="['router-link-active']" class="list-group-item">
    							<i class="fa fa-fw fa-keyboard-o"></i>&nbsp;{{ 'text' | translate }}
    						</a>
    					</li>
    					<li>
    						<a [routerLink]="['/doc']" [routerLinkActive]="['router-link-active']" class="list-group-item">
    							<i class="fa fa-fw fa-file-text"></i>&nbsp;{{ 'doc' | translate }}
    						</a>
    					</li>
    					<li>
    						<a [routerLink]="['/pdf']" [routerLinkActive]="['router-link-active']" class="list-group-item">
    							<i class="fa fa-fw fa-file-pdf-o"></i>&nbsp;{{ 'pdf' | translate }}
    						</a>
    					</li>
    					<li>
    						<a [routerLink]="['/image']" [routerLinkActive]="['router-link-active']" class="list-group-item">
    							<i class="fa fa-fw fa-picture-o"></i>&nbsp;{{ 'image' | translate }}
    						</a>
    					</li>
    				</ul>
    			</li>
    		</div>

    		<a routerLink="/dictionary" [routerLinkActive]="['router-link-active']" class="list-group-item">
    			<i class="fa fa-fw fa-list"></i>&nbsp;{{ 'school dictionary' | translate }}
    		</a>

    	</ul>
    </nav>

Legend
Html element
Component
Html element with directive

# results matching ""

# No results matching ""