Angular Material 2 md-input-container不工作

Question

我遇到了angular-material2的问题，我试图使用输入。但是，我所尝试的都没有奏效。

我遇到了这个问题：

  

＆＃39; MD-输入容器＆＃39;不是一个已知的元素

HTML：

<md-input-container>
<input mdInput placeholder="Favorite food" value="Sushi">
</md-input-container>

我在 component.ts 和我的 app.ts 中导入了此内容：

import { MdInputModule } from '@angular/material';

我在我的＆＃39;进口＆＃39;在 app.ts

中的@NgModule中

我的材料版本是 @ angular / material @ 2.0.0-beta.8

感谢您的帮助。

编辑：我发现我在 app.module.ts 中导入了它，导入了我需要声明的另一个模块。我的代码有点乱，我需要清理它。对不起，我的朋友们。案件结案。

Answer 1

import { MdInputModule } from '@angular/material';

在MdInputModule imports: [ MdInputModule ]的{​​{1}}中@NgModule添加app.ts

Answer 2

您应该将MdInputModule放入app.module.ts的导入中。 您还应该导入您使用的Material元素的每个模块

Answer 3

通过仅导入您使用的组件的模块，您的方式是正确的。如果仅使用一个或两个组件，则导入整个MaterialModule是过度的。 您需要确保的是（来自Getting Started guide, step 3）：

  

无论您使用哪种方法，请务必导入Angular材质   Angular的BrowserModule之后的模块，因为导入顺序很重要   NgModules。

Answer 4

使用mat-form-field代替md-input-container或mat-input-container。 由于其当前受支持的输入容器（根据发行版8.0.0）。有关更多信息，请参见 official angular material doc

Answer 5

将材料模块导入您的应用以访问材料的核心指令

import { MaterialModule } from '@angular/material';