问题标签 [angular2-material]

我刚搬到angular-cli 1.0.0-beta.11-webpack.2
有很多烦人的事情，但我面临的最大问题是外部css文件（可能我也会遇到 js文件的问题）。

在我的项目中使用了 Angular2 材料，并且menu component需要overlay.css. 当我将它包含在index.html：

之后ng serve或distng build文件夹中缺少覆盖 css 文件。

有问题angular-cli github。_ 我完全按照提到的方式做了所有事情，但仍然无法正常工作。

我创建了一个assets文件夹和styles.css文件

• 源代码
• 源/应用

我的angular-cli.json文件看起来像：

我想问一下如何在我的项目中包含一个库 css 文件（第 3 部分 css），以利用它的好处angular-cli webpack？

我正在使用 angular2 RC4 开发一个项目。我添加了 angular2-material 第三方库。我导入了一些组件，例如按钮和工具栏，将它们添加到寺庙上。这看起来很成功，但是当我添加菜单和选项卡时出现错误：

未找到 menu.js 和 tabs.js。

我检查了路径和文件；一切就绪，就像按钮和工具栏一样。

我使用 Angular RC5 创建了一个新的演示项目，并添加了 angular2-material 组件，包括menu、tabs和button。这正如预期的那样完美。

Angular2 RC4 是否不支持所有 Angular2-Material 组件，或者我遗漏了什么？

有人可以纠正我的问题吗？

我正在使用@angular-2.0.0-rc.5、@angular2-material 2.0.0-alpha.7-4 和 Angular-CLI 1.0.0-beta.11-webpack.2

当我尝试编译它时会抛出一个错误，找不到名称'HammerManager'。请参阅随附的屏幕截图。

我找到了一些适用于 Angular-CLI（非 webpack）版本的解决方案，但没有找到适用于 webpack 版本的解决方案。

有人用上述设置解决了这个问题吗？

我对 Angular2 及其生态系统还很陌生，我试图弄清楚事情是如何协同工作的。对不起，如果有些问题看起来微不足道。

因此，我在使用 Webpack 的AngularClass starter kit的帮助下部署了一个全新的 Angular2 应用程序。

对于 UI，我想使用 Material 而不是 Bootstrap。我做了一些研究，开始迷失在围绕 Material 的大量项目中。我正在寻找的是：

• 一种使用 Material css 和类的简单方法，例如网格 ...
  • materialize似乎是解决方案。
• 使用指令
  • 我发现angular2-materialize可以做到这一点
• 使用 Material 组件作为 Angular2 组件
  • material2是我发现的提供这些东西的最先进的项目。

很多：D 另外，我找到了适用于 Angular2 的 Material Design Lite，但让它失望了，因为它似乎会在 Material2 退出 Alpha 时被弃用。

1）这三个包能很好地协同工作吗？ 我还没有找到任何可以满足我列出的所有需求的包。

好的，所以我开始安装 angular2-materialize，但我被 Webpack 阻止了。Github 自述文件告诉，安装 MaterialCSS 和 angular2-materialize ：

然后导入materialize-css样式

2) 如果我们稍后包含来自 cdn 的 css，那么 npm 在本地安装 materialize-css 包有什么意义？

所以我试图找到一种方法来从 node_modules/materialize-css 本地包含 css ......在这里我被阻止了。NPM 的文档与 Github 不同，还有一些额外的步骤，比如在 webpack 配置中添加别名、加载器和插件。

有了这个配置，我想我可以在我的 vendor.browser.ts 中做类似的事情：

它会自动加载和/或放置指向已构建的 CSS。或者我错了，它不能这样工作？

显然它不起作用，我得到一个：

为什么 ？

非常感谢你们的帮助

根级别的导入不应该在全球范围内可用（全球我的意思是所有子模块和组件）？

我有以下根/应用程序模块：

如果我尝试在其中一个子模块中使用它们不显示的材料元素，则子模块如下所示：

但是，如果我在它们显示的子模块中导入材料模块。这是材料设计组件工作时子模块的样子：

既然已经在根级别导入了材质模块，为什么还要在子级别再次导入？

因此，在与版本进行了多次斗争之后，我有了一个全新的 angular-cli 启动应用程序，按照 Angular2-materials 自述文件完成了所有操作，获得了要加载和编译的按钮和卡片，并且我的应用程序仍然可以正常加载。

然后我在我的组件中添加了一个 Import for MdSidenavModule，一切都很好。然后在我的 app.module 文件的顶部调用 MdSidenavModule 的导入，并在 @NgModule 中将 MdSidenavModule 添加到导入部分，就像我为按钮和卡片所做的那样。除非我这样做并保存，否则我的应用程序可以正确编译，但它永远不会离开“正在加载...”并进入我应该打印“应用程序工作！”的组件。就像默认的 angular-cli 应用程序一样。

任何帮助将不胜感激！

我进入控制台的错误是

这是我的 app.module.ts

还有我的 app.component.ts

我已经仔细检查并安装了sidenav，但为了确定，我也重新安装了它。不知道我错过了什么。

我一直在使用 angular2 rc 5 和 ngModule

所以现在我想使用角度材料。例如，我想使用 angular2 材质 sidenav。我一直在使用 npm 安装它

npm i @angular2-material/sidenav

然后我把那个 angular 2 材料放在我的 systemjs-config.js

之后我在我的 ngModule 中导入了角度材料

但我有一个错误

http://localhost:3000/node_modules/@angular2-material/button/ 404（未找到）

我的代码有问题吗？

我刚刚升级了我的应用程序以使用Angular 2 rc.6和Angular Material 2 alpha 8-1. 这些包依赖，typescript 2后者使用了 newreadonly修饰符。

我用来编译我的 .ts 文件，现在我从使用修饰符gulp-typescript的文件中得到很多错误。readonly例如，这一行：

在编译期间抛出这些错误：

错误 TS1005：预期为“=”。

错误 TS1005：';' 预期的。

错误 TS1005: '(' 预期。

我认为这可能是因为gulp-typescript内部使用typescript 1.8.10，它没有readonly修饰符。

我自己的代码都没有使用readonly；唯一引发错误的文件是包中的第三方打字稿定义文件 ( .d.ts) Angular 2 Material。有问题的文件都在我的nodes_module/文件夹中，我试图通过在以下内容中忽略它们tsconfig.json：

错误仍然出现。

• 我可以解决这个问题吗？
• 如果没有，是否有一种简单的方法可以让编译器忽略.d.ts文件？

我最近将我的项目升级到 Angular 2 RC 6 和 Material 2.0.0-alpha.8-1 但它不起作用，谁能指导我在这里缺少什么？任何人都可以与 Angular 2 RC 6 和 Material 2.0.0-alpha.8-1 分享一个工作的 plunker 吗？

我的 package.json 中有以下软件包：

在 AppModule 中，我首先导入了以下所需模块：

然后在导入列表中添加以下内容：

在提供者中：

在我的 SystemJs 配置文件中，我有：

以下是我运行应用程序时控制台上显示的错误消息：

我正在创建一个侧边栏。它应该由许多图标组成，当用户单击特定图标时，会重定向到相应的页面。但问题是单击图标后，工具提示（来自angular2-material）不会隐藏，并且每次单击图标后，其工具提示都会固定。

如何在 10 毫秒后隐藏工具提示？

非常感谢