角度材质2表单元素

Question

我正在使用以下方式开发Angular Web应用程序：

• Angular 4.1.2
• Angular Material 2.0.0-beta.11

我正在尝试创建一个简单的模态对话框，在打开时，它提供了一些输入字段供用户完成和提交。我的对话框将包含：

• 简单的文字输入。
• 下拉列表
• 日历选择器

首先，我只添加了一个文本输入字段和一个选择下拉列表。我无法理解是否需要创建<form>并将每个元素包装在<md-form-field>中。当我尝试这个时，我收到一个错误：

md-form-field must contain a MdFormFieldControl. Did you forget to add mdInput to the native input or textarea element?

如果我没有将<md-select>元素包裹在<md-form-field>中，则我没有错误，但样式与其上方的<input>元素不同。

我无法弄清楚如何在同一个模态对话框中包含同样样式的所有3个UI组件。任何建议都非常欢迎。

Answer 1

输入和选择之间样式的不匹配一直是Angular Material中的一个问题。最近通过尽可能多地共享css解决了这个问题，这引发了从md-input-container到md-form-field的更改。您现在可以在md-form-field内放置选择和输入，它们看起来很棒。

但是，这些更改在beta.11中不可用。您可以通过安装material2-builds来使用它们，否则将必须等待beta.12版本。

同时，您可以覆盖CSS（this thread中的结帐解决方法）。