0

我正在使用 Material 2 开发 Angular 2 项目。由于某种原因，没有显示图标，只是应该作为文本的图标的“键”。

应用程序模块：

  ...    
    import {MdButtonModule} from "@angular2-material/button";
    import {MdIconModule, MdIconRegistry} from "@angular2-material/icon";
    ...

    @NgModule({
      declarations: [AppComponent,... CollapseableComponent],
      imports: [... MdButtonModule, MdIconModule, MdInputModule],
      providers: [{
        provide: LocationStrategy,
        useClass: HashLocationStrategy
      }, ... MdIconRegistry],
      bootstrap: [AppComponent]
    })
    export class AppModule {

    }

索引.html：

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

我尝试了几种方法：

  <button md-fab> <md-icon>add</md-icon></button>
    <button md-fab> <md-icon class="md-elevation-z1">create</md-icon></button>
    <button md-icon-button>add</button>

我想我又尝试了大约 5 种排列，但结果都是一样的。我看到了按钮，但上面有文字。仅图标本身也没有在任何这些方法中显示。

4

3 回答 3

7
于 2016-12-10T22:39:26.347 回答
0

正如 JJB 指出的那样，在 index.html 中包含 google css 时，这个问题的特殊问题是一种错误的引号（这是一个复制粘贴错误）。

更重要的是 JJB 说的另一件事 - @angular2-material 已被弃用。

于 2016-12-11T11:35:04.860 回答
0 
We have to follow the steps in ng2-image-viewer  

https://www.npmjs.com/package/ng2-image-viewer

After complete those steps, we have to include material icons link in index.html

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

//For Material icons add code in style.css file They taken Opacity as 0 we can override to 1 then icons will display

.inline-icon > div > .tooltip:first-child {
    pointer-events: none;
  }

  .options-image-viewer > .tooltip {
    opacity: 1 !important;
    pointer-events: visible !important;
  }

  .inline-icon, .image-gallery-2 {
    background-color: #222B38 !important;
  }

Wow, It's working fine.............
于 2019-01-29T08:04:38.040 回答