角 2 材料答案

【问题标题】：Angular 2 Material角 2 材料
【发布时间】：2016-08-19 09:14:49
【问题描述】：

在将 angular 2 更新为 rc5 并将材料更新为 alpha.7-4 后，我在 webpack 上构建时遇到了问题。

例如，如果我在某些组件的指令中添加 MdInput，则会出现错误：

node_modules/webpack-core/lib/NormalModuleMixin.js:151
                                throw e;
                                ^

TypeError: Cannot read property 'substr' of undefined

在官方存储库的示例中，它们有奇怪的导入

import {MaterialModule} from '@angular2-material/all/all';

我没有这个模块并且在我的节点模块中找不到这个路径。但是如果将此文件复制到目录中，则没有效果。

【问题讨论】：

标签： angular material-design

【解决方案1】：

所有你需要的应该是你的 app.module.ts 中的这个

import {MdInputModule} from '@angular2-material/input';

@NgModule({
  imports: [MdInputModule],
  ...
})

还必须安装@angular2-material/core

【讨论】：

【解决方案2】：

Angular 2 Material 'all' 模块似乎已被删除。我最近使用 RC5 进入 Angular 2，发现创建一个布局模块足以满足“所有”需求：

layout.module.ts:

 import { NgModule }      from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { MdCoreModule } from '@angular2-material/core';
 import { MdSidenavModule } from '@angular2-material/sidenav';
 import { MdToolbarModule } from '@angular2-material/toolbar';
 import { MdCardModule } from '@angular2-material/card';
 import { MdButtonModule } from '@angular2-material/button';
 @NgModule({
   imports: [
     CommonModule, MdCoreModule, MdSidenavModule, MdToolbarModule, MdCardModule, MdButtonModule],
   exports: [MdCoreModule, MdSidenavModule, MdToolbarModule, MdCardModule, MdButtonModule]
 })
 export class LayoutModule { }

然后我将它导入到我的应用程序模块中的“导入”数组中。到目前为止，这就是我所需要的，并且我在应用程序中包含的具有 Material 元素的所有其他模块/组件都继承了 md 指令。

【讨论】：

当我尝试在我的模块中添加一些 MdModule 时，我的问题出现了 webpack 错误。它不是 Angular 它的 webpack