@angular-material-extensions/components
    TypeScript icon, indicating that this package has built-in type declarations

    1.2.0 • Public • Published

    angular-material-extensions's logo

    @angular-material-extensions/components - contains a set of prebuilt extended angular material components, simple API and easy to use.

    Table of Contents

    Demo

    View all the directives in action at https://angular-material-extensions.io/


    Dependencies

    • Angular developed and tested with 8.x

    Installation

    Now install @angular-material-extensions/components via:

    npm install --save @angular-material-extensions/components

    Components

    mat-menu-button - material selection box with icons or images learn more

    Import the library

    Once installed you need to import the main module:

    import { MatMenuButtonModule } from '@angular-material-extensions/components';

    The only remaining part is to list the imported module in your application module. The exact method will be slightly different for the root (top-level) module for which you should end up with the code similar to (notice MatPasswordStrengthModule .forRoot()):

    import { MatMenuButtonModule } from '@angular-material-extensions/components';
    import { MatDialogModule } from '@angular/material';
    
    @NgModule({
      declarations: [AppComponent, ...],
      imports: [
        MatMenuButtonModule,
        MatDialogModule,
         ...],  
      bootstrap: [AppComponent]
    })
    export class AppModule {
    }

    Usage

    <mat-menu-button [menuItems]="menuItems" 
                     (onMenuItemSelected)="onMenuItemSelected($event)">
    </mat-menu-button>
    import {MatMenuButtonItem} from '@angular-material-extensions/components';
    
    
    menuItems: MatMenuButtonItem[] = [
        {
          key: 'mute_key',
          imgURL: 'assets/img/icons/essential-collection/png/mute.png',
          text: 'Mute'
        },
        {
          key: 'play_key',
          imgURL: 'assets/img/icons/essential-collection/png/play-button-1.png',
          text: 'Play'
        },
        {
          key: 'pause_key',
          imgURL: 'assets/img/icons/essential-collection/png/pause-1.png',
          text: 'Pause'
        },
      ];
    
    onMenuItemSelected(menuKey: string) {
        console.log('menu key:', menuKey);
      }

    Other Angular Libraries


    Support

    Built by and for developers ❤️ we will help you 👊


    jetbrains logo

    This project is supported by jetbrains with 1 ALL PRODUCTS PACK OS LICENSE incl. webstorm


    License

    Copyright (c) 2019 Anthony Nahas. Licensed under the MIT License (MIT)

    Keywords

    none

    Install

    npm i @angular-material-extensions/components

    DownloadsWeekly Downloads

    0

    Version

    1.2.0

    License

    none

    Unpacked Size

    93.6 kB

    Total Files

    35

    Last publish

    Collaborators

    • anthonynahas