Material Icons for Ionic Apps
Use md-name
instead of name
when you want to use a material icon. Icon names can be found on this page: https://material.io/icons/. All names are a single lowercase words, example: alarm add
would be alarm_add
.
<ion-icon md-name="settings"></ion-icon>
You can download this repo, then copy the font files and the directive into your app. Or follow these steps:
npm i ionic2-material-icons
Import MaterialIconsModule
into your app's root and shared modules.
import { MaterialIconsModule } from 'ionic2-material-icons';
@NgModule({
...
imports: [
...
MaterialIconsModule
]
})
Add this code to your package.json
:
"config": {
"ionic_copy": "./copy.config.js"
}
Create a new file named copy.config.js
in your app's root directory, and add the following content to it:
module.exports = {
copyMaterialIcons: {
src: ['{{ROOT}}/node_modules/ionic2-material-icons/fonts/**/*'],
dest: '{{WWW}}/assets/fonts'
}
};