All Angular Materiel Module with Dependencies Version 9

BlogSh SOHEL29 Oct, 2023 3360833

All Angular Materiel Module with Dependencies Version 9: Last two days I have been trying to add Angular Materiel in my Project with Bootstrap . But Angular Materiel 9+ had separated it's dependencies. So I could fixed it with a extra module . It can be any name like "AngularMaterialModule".

All Angular Materiel Module with Dependencies

I give you AngularMaterialModule with Dependency and Import and Export Logic . Please don't mind because my English writing skill so dirty . How to generate a module like this. Cli Command: ng g module [ModuleName] Example: ng g module AngularMaterialModule if you want to use routing , Example: ng g module AngularMaterialModule --routing

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatButtonModule } from '@angular/material/button';
import { MatInputModule } from '@angular/material/input';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatRadioModule } from '@angular/material/radio';
import { MatSelectModule } from '@angular/material/select';
import { MatSliderModule } from '@angular/material/slider';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatMenuModule } from '@angular/material/menu';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatListModule } from '@angular/material/list';
import { MatGridListModule } from '@angular/material/grid-list';
import { MatCardModule } from '@angular/material/card';
import { MatStepperModule } from '@angular/material/stepper';
import { MatTabsModule } from '@angular/material/tabs';
import { MatExpansionModule } from '@angular/material/expansion';
import { MatButtonToggleModule } from '@angular/material/button-toggle';
import { MatChipsModule } from '@angular/material/chips';
import { MatIconModule } from '@angular/material/icon';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatDialogModule } from '@angular/material/dialog';
import { MatTooltipModule } from '@angular/material/tooltip';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatTableModule } from '@angular/material/table';
import { MatSortModule } from '@angular/material/sort';
import { MatPaginatorModule } from '@angular/material/paginator';
import { FormsModule } from '@angular/forms';

@NgModule({
  declarations: [],
  imports: [
    CommonModule,
    MatCheckboxModule,
    MatCheckboxModule,
    MatButtonModule,
    MatInputModule,
    MatAutocompleteModule,
    MatDatepickerModule,
    MatFormFieldModule,
    MatRadioModule,
    MatSelectModule,
    MatSliderModule,
    MatSlideToggleModule,
    MatMenuModule,
    MatSidenavModule,
    MatToolbarModule,
    MatListModule,
    MatGridListModule,
    MatCardModule,
    MatStepperModule,
    MatTabsModule,
    MatExpansionModule,
    MatButtonToggleModule,
    MatChipsModule,
    MatIconModule,
    MatProgressSpinnerModule,
    MatProgressBarModule,
    MatDialogModule,
    MatTooltipModule,
    MatSnackBarModule,
    MatTableModule,
    MatSortModule,
    MatPaginatorModule
  ],
  exports:[
    MatCheckboxModule,
    MatCheckboxModule,
    MatButtonModule,
    MatInputModule,
    MatAutocompleteModule,
    MatDatepickerModule,
    MatFormFieldModule,
    MatRadioModule,
    MatSelectModule,
    MatSliderModule,
    MatSlideToggleModule,
    MatMenuModule,
    MatSidenavModule,
    MatToolbarModule,
    MatListModule,
    MatGridListModule,
    MatCardModule,
    MatStepperModule,
    MatTabsModule,
    MatExpansionModule,
    MatButtonToggleModule,
    MatChipsModule,
    MatIconModule,
    MatProgressSpinnerModule,
    MatProgressBarModule,
    MatDialogModule,
    MatTooltipModule,
    MatSnackBarModule,
    MatTableModule,
    MatSortModule,
    MatPaginatorModule,
    
  ]
})
export class AngularMaterialModule { }

then you can use it another module like given bellow:

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
.....
import { AngularMaterialModule } from '../common/angular-material/angular-material.module';
.....

@NgModule({
  declarations: [ ],
  imports: [
    CommonModule,
...
    AngularMaterialModule,
...
  ]
})
export class AdminModule { }

About Angular Material :

Progressive Web Apps

Use modern web platform capabilities to deliver app-like experiences. High performance, offline, and zero-step installation.

Native

Build native mobile apps with strategies from Cordova, Ionic, or NativeScript.

Desktop

Create desktop-installed apps across Mac, Windows, and Linux using the same Angular methods you've learned for the web plus the ability to access native OS APIs.

More ..........

Our Social Media:

DG Food Job Exam Question Solution Download PDF

Contact us: If you want more information, so contact us with Facebook Fan Page as soon as possible. We are waiting for you! Or Email us following by our website’s Contact Page. Thank you for visiting here.

PRE

2775 Posts of BSCS MCQ results have been published in 2024

Download 40th BCS Special Current Affairs PDF