Angular 中文文档 Angular 中文文档
指南
GitHub (opens new window)
指南
GitHub (opens new window)
  • 介绍
  • 快速上手

  • 理解 Angular

  • 开发指南

NG-MATERO

Ng-Matero is an Angular admin template made with Material components.

✨ Features


Material Extensions
Schematics support
Modern design style
Multiple admin layout
Powerful color system
Rich CSS helpers
Dark mode support
RTL support
Internationalization
Authentication
HTTP interceptors
Permissions management

📖 Documentation


English |简体中文

📦 Compatibility


Which version to use?

Angular Material Ng-Matero Extensions
:--- :--- :--- :---
v15 v15 15.x.x 15.x.x
v14 v14 14.3.0 14.6.4
v13 v13 13.1.1 13.3.2
v12 v12 12.8.0 12.10.2
v11 v11 11.3.2 11.5.1
v10 v10 10.4.1 10.16.5
v9 v9 9.7.2 9.11.14
v8 v8 0.16.0 0.9.3

🔧 Installation


The project has support ng add yet.

  1. ``` shell
  2. $ ng new <project-name>
  3. $ cd <project-name>
  4. $ ng add ng-matero
  5. ```

You can also git clone the starter repo to start. But it's not recommended.

  1. ``` shell
  2. $ git clone --depth=1 git@github.com:ng-matero/starter.git <project-name>
  3. $ cd <project-name>
  4. $ npm install
  5. ```

⚙️ Schematics


You can use the ng-matero schematics to generate a module or a page.

Module schematic


Generate a lazy loaded module.

  1. ``` shell
  2. $ ng g ng-matero:module <module-name>
  3. ```

The new module will be created in routes folder, it will be added in routes.module and its route declaration will be added in routes-routing.module automaticly.

Page schematic


Generate a page component in the module.

  1. ``` shell
  2. $ ng g ng-matero:page <page-name> -m=<module-name>
  3. ```

Generate a entry component in the page component.

  1. ``` shell
  2. $ ng g ng-matero:page <page-name>/<entry-component-name> -m=<module-name> -e=true
  3. ```

Example


Just two steps after initializing the project, you can get a route page.

  1. ``` shell
  2. $ ng g ng-matero:module abc
  3. $ ng g ng-matero:page def -m=abc
  4. ```

Take a look at http://localhost:4200/#/abc/def, enjoy it!

💻 Development


  1. ``` shell
  2. $ git clone git@github.com:ng-matero/ng-matero.git
  3. $ cd ng-matero
  4. $ npm install
  5. $ npm run hmr
  6. ```

Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

🗺 Roadmap


Check projects to know the develop plans.

🤝 Contributors


Code Contributors


This project exists thanks to all the people who contribute. [Contribute ].

Financial Contributors


Become a financial contributor and help us sustain our community. [Contribute ]

Individuals


Organizations


Support this project with your organization. Your logo will show up here with a link to your website. [Contribute ]

📃 License


MIT
Last Updated: 2023-09-03 17:10:52