Components: Material icon doesn't show

[leihuagh]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

It should work

What is the current behavior?

Result: Material icon doesn't show on button, on card, on anywhere

What are the steps to reproduce?

Step by step followed the https://material.angular.io/guide/getting-started

What is the use-case or motivation for changing an existing behavior?

First time try

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 5.0.0-rc.3
Material: 2.0.0-beta.12
OS: Windows 10
Typescript: 2.5.3
Browsers: Google Chrome

Is there anything else we should know?

I imported hammerjs. I linked the google material+icon to index.html

[EdricChan03]

Show your full code please.

[leihuagh]

https://github.com/leihuagh/MEAN-Project-Learning/blob/02_build_client/client/src/app/nav/nav.component.html

menu
Home

menu icon online show the text

[leihuagh]

https://github.com/leihuagh/MEAN-Project-Learning/blob/02_build_client/client/src/app/nav/nav.component.html

menu
Home

On Sun, Oct 22, 2017 at 1:33 AM, Edric Chan [e-mail]
wrote:

Show your full code please.

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
https://github.com/angular/material2/issues/7948#issuecomment-338452952,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AFu8-QE2MeunzG-y_27cJZtHt2bW7yNoks5sutOmgaJpZM4QByFo
.

--
Lei Hua
[email protected] [e-mail]

[EdricChan03]

That's because you're missing the CSS stylesheet for Material Icons!

Add the following to your index.html:

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

Around here:
https://github.com/leihuagh/MEAN-Project-Learning/blob/ba731ca72d98e1eaaf9bb0067c130184979de035/client/src/index.html#L6-L8

[ghd8]

@leihuagh - Import of MatIconModule is missing. (in "_app-material.module.ts_")

For troubleshooting / questions please use stack overflow, gitter, etc.

[leihuagh]

@ghd8 Thank you so much. The MatIconModule was missing in my material list

It works now.

@Chan4077 Thank you too

It could be nice to have entire material package in one in the future releases.

[mandaputtra]

Hello, i found this issue not working on IOS. I tried to use mat-error on IOS and its not showing, the code i use :

  <div class="error-container" *ngIf="dataerror">
    <div class="error-content">
      <div class="error-icon">
        <mat-icon color="warn">warning</mat-icon>
      </div>
      <div class="error-label">
        <span>{{errordesc}}</span>
      </div>
    </div>
  </div>

I also attach the stylesheet on index html.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}