正确导入后，角度应用中不会应用素材样式

Question

我的问题是我的样式表正确地包含在网页中，但样式没有得到应用。问题如下：

我正在尝试使用Angular材料，我正确设置了我的应用，如begginer's guide所示。

我检查了我的应用，并且样式表正确导入（包含）。但是，这些样式没有得到应用。

我的网络标签的屏幕截图：

应用程序选项卡还说明已应用样式表：

我试图通过三种方式包含主题设计：

1）在styles.css中使用@import "~@angular/material/prebuilt-themes/indigo-pink.css";

2）在index.html中使用链接元素，如：<link href="node_modules/@angular/material/prebuilt-themes/indigo-pink.css" rel="stylesheet">（它没有成功）

3）所以我制作了一个资产文件夹并将我的所有文件放在那里：

然后在我的angular-cli.json文件中，我有gulp配置如：

"assets": [
    { "glob": "**/*", "input": "./assets/Images/", "output": "./assets/Images/" },
    { "glob": "**/*", "input": "./assets/StyleSheets/", "output": "./assets/StyleSheets/" },
    { "glob": "**/*", "input": "./assets/Javascript/", "output": "./assets/Javascript/" },
    { "glob": "**/*", "input": "./assets/Json/", "output": "./assets/Json/" },
    "favicon.ico"
  ]

然后我将样式表包括在内：<link rel="stylesheet" type="text/css" href="assets/StyleSheets/deeppurple-amber.css">并且它有效。

但是，当我尝试使用以下样式时： <button md-raised-button color="primary">Click me!</button>

样式没有得到应用。

请帮我弄清楚我做错了什么。

如果您需要存储库链接来重新生成问题，请告诉我。

Answer 1

我遇到了同样的问题。我解决了它将样式放在angular-cli.json文件中：

"styles": [
    "styles.scss",
    "../node_modules/@angular/material/prebuilt-themes/indigo-pink.css"
],