Angular4 Material 主题在 ASP.NET 核心项目上无法正常工作
Angular4 Material theme not working properly on ASP.NET Core project
我刚刚使用本网站提到的 ASP.NET 核心 Angular SPA 模板创建了一个项目：Building Single Page Applications on ASP.NET Core with JavaScriptServices
之后，我添加了@angular/material、@angular/cdk 和@angular/flex-layout npm 包。
我使用 Angular Material 工具栏和菜单制作了一个非常简单的页面。
我 link 在 _Layout.cshtml 上编辑了 Pink-BlueGrey.css 预建主题（手动将 css 文件复制到 wwwroot 以使事情变得简单）。
结果是所有 Angular Material 组件现在都设置了样式，但是 material 组件中未包含的每个 html 都保持未设置样式。我不明白为什么。因为如果我使用 Angular CLI 创建项目，一切都会按预期方式进行。
我选择的这个主题背景是深色的。我需要字体是白色的，这样人们才能阅读。但这不是 ASP.NET 核心项目中发生的事情。
我认为这可能是 webpack 配置问题。我试图从 _Layout.cshtml 中删除 link 到 css 文件，并添加到 webpack.config.vendor.js 中的供应商包中。但结果是一样的。它有效，但不是我想要的方式。
这是应该发生的吗？这是设计使然吗？我是否应该编写一个 CSS 文件来为 Angular Material 组件中未包含的所有 HTML 设置样式？
我试图通过从 _ViewImports.cshtml 中删除 "Microsoft.AspNetCore.SpaServices" tagHelper 和从 [=42= 中删除 asp-prerender-module 指令来禁用服务器端预渲染].一切都保持不变。不知道怎么回事。
我是网络开发的新手，我认为这应该是简单的事情。但是我找不到任何人遇到过这个确切的设置和问题。
所以，我对 Angular CLI 的看法是错误的。我用它制作的项目正在使用 mdSidenav。当我用一个简单的 div 替换 md-sidenav-container 指令并删除 sidenav 组件时，Pink-BlueGrey 的深色背景消失了，我的所有文本又变成了黑色。我在 ASP.NET Core 项目中的行为相同。所以这不是 ASP.NET 核心设置的问题。
我决定用来解决上述问题的方法是，而不是将 "mat-app-background" class 放在 body 标签中，并且必须为页面中的每个文本使用 material 容器，我在根应用程序组件上使用了 md-sidenav-container 指令。我没有使用 sidenav 本身。只是它是容器，所以使用的每个文本，即使它只是一个 h1 标签，都会被设置样式，因为它包含在 material 组件中。
也许这不是最优雅的解决方案。所以如果有人有更好的建议...
我刚刚使用本网站提到的 ASP.NET 核心 Angular SPA 模板创建了一个项目：Building Single Page Applications on ASP.NET Core with JavaScriptServices
之后，我添加了@angular/material、@angular/cdk 和@angular/flex-layout npm 包。
我使用 Angular Material 工具栏和菜单制作了一个非常简单的页面。 我 link 在 _Layout.cshtml 上编辑了 Pink-BlueGrey.css 预建主题（手动将 css 文件复制到 wwwroot 以使事情变得简单）。
结果是所有 Angular Material 组件现在都设置了样式，但是 material 组件中未包含的每个 html 都保持未设置样式。我不明白为什么。因为如果我使用 Angular CLI 创建项目，一切都会按预期方式进行。
我选择的这个主题背景是深色的。我需要字体是白色的，这样人们才能阅读。但这不是 ASP.NET 核心项目中发生的事情。
我认为这可能是 webpack 配置问题。我试图从 _Layout.cshtml 中删除 link 到 css 文件，并添加到 webpack.config.vendor.js 中的供应商包中。但结果是一样的。它有效，但不是我想要的方式。
这是应该发生的吗？这是设计使然吗？我是否应该编写一个 CSS 文件来为 Angular Material 组件中未包含的所有 HTML 设置样式？
我试图通过从 _ViewImports.cshtml 中删除 "Microsoft.AspNetCore.SpaServices" tagHelper 和从 [=42= 中删除 asp-prerender-module 指令来禁用服务器端预渲染].一切都保持不变。不知道怎么回事。
我是网络开发的新手，我认为这应该是简单的事情。但是我找不到任何人遇到过这个确切的设置和问题。
所以，我对 Angular CLI 的看法是错误的。我用它制作的项目正在使用 mdSidenav。当我用一个简单的 div 替换 md-sidenav-container 指令并删除 sidenav 组件时，Pink-BlueGrey 的深色背景消失了，我的所有文本又变成了黑色。我在 ASP.NET Core 项目中的行为相同。所以这不是 ASP.NET 核心设置的问题。
我决定用来解决上述问题的方法是，而不是将 "mat-app-background" class 放在 body 标签中，并且必须为页面中的每个文本使用 material 容器，我在根应用程序组件上使用了 md-sidenav-container 指令。我没有使用 sidenav 本身。只是它是容器，所以使用的每个文本，即使它只是一个 h1 标签，都会被设置样式，因为它包含在 material 组件中。
也许这不是最优雅的解决方案。所以如果有人有更好的建议...