Angular Material快速搭建Admin Dashboard開發起手式到側邊導覽Routing添加
首先電腦環境確認nodejs跟npm 以及angular cli都裝好了 沒有就下如下指令補安裝 npm install -g @angular/cli 接著創建angular新專案這裡命名angularadmin 建立好就移動至下一層專案所在目錄 ng new angularadmin cd angularadmin 接著ng add material函式庫進來 直接用material所附帶的component (navigation,dashboard) 進行建立 ng add @angular/material ng generate @angular/material:navigation navigation ng generate @angular/material:dashboard dashboard 預設當你在引入 material時候會問你要採用捨麼風格 風格列表機本上如下 當我們已經把該裝的跟建立的準備好後 可以先ng serve啟動來看下目前效果 先到angularadmin/src/app/app.component.html 把預設提供的畫面範本用如下內容複製粘貼給覆蓋掉 <app-navigation></app-navigation> Material預設自動幫我們準備好的NavigationComponent navigation.component.ts 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 import { Component } from '@angular/core' ; import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout' ; import { Observable } from 'rxjs' ; import { map, shareReplay } from 'rxjs/operators' ; @ Component({ selector: 'app-navigation' , templateUrl: ...