File
Index
Properties
|
|
|
Methods
|
|
|
Inputs
|
|
|
|
sheetDetails
|
Type : SheetDetails[]
|
Default value : []
|
|
|
|
title
|
Type : string
|
Default value : ''
|
|
|
|
Public
childMenu
|
Type : MatMenu
|
Decorators :
@ViewChild('childMenu', {static: true})
|
|
|
|
sheetURL
|
Type : string
|
Default value : 'https://docs.google.com/spreadsheets/d/'
|
|
|
|
window
|
Default value : window
|
|
|
import { Component, Input, ViewChild } from '@angular/core';
import { MatMenu } from '@angular/material/menu';
import { SheetDetails } from '../../models/sheet.model';
@Component({
selector: 'app-table-nested-menu',
templateUrl: './table-nested-menu.component.html',
styleUrls: ['./table-nested-menu.component.scss'],
})
export class TableNestedMenuComponent {
@Input() sheetDetails: SheetDetails[] = [];
@Input() title = '';
window = window;
@ViewChild('childMenu', { static: true }) public childMenu!: MatMenu;
sheetURL = 'https://docs.google.com/spreadsheets/d/';
openURL(sheetId: string, gid: string) {
this.window.open(`${this.sheetURL}${sheetId}/edit#gid=${gid}`, '_blank');
}
}
<mat-menu #childMenu="matMenu" [overlapTrigger]="false">
<span *ngFor="let sheet of sheetDetails">
<!-- Organ Names node menu items -->
<span *ngIf="sheet.version && sheet.name !== 'all'">
<button mat-menu-item color="primary" [matMenuTriggerFor]="menu">
<span>{{ sheet.display }}</span>
</button>
</span>
<mat-menu #menu="matMenu" [overlapTrigger]="false">
<span *ngFor="let version of sheet?.version">
<!-- Versions node menu items -->
<span *ngIf="version">
<button (click)="openURL(version.sheetId ?? '', version.gid ?? '')" mat-menu-item color="primary">
<span>{{ version.viewValue }}</span>
</button>
</span>
</span>
</mat-menu>
</span>
</mat-menu>
Legend
Html element with directive