角材料在同一行上有多个“输入”

Question

如何在同一行上添加多个输入？我已经尝试过使用引导程序，但是由于某种原因它无法正常工作。如果您有一些要给我看的例子。

<form class="example-form">
    <mat-form-field class="example-full-width">
      <input matInput placeholder="First Name">
    </mat-form-field>

    <mat-form-field class="example-full-width">
      <input matInput placeholder="Last Name">
    </mat-form-field>
</form>

Answer 1

默认情况下，Angular Material的输入在行中显示（请参见下面的stackblitz），可能是您在项目中的某处覆盖了此行为，我的意思是CSS规则。如果您喜欢Flexbox，则可以使用@ angular / flex-layout，可以轻松地控制项目的显示方式：行或列，并且此包在Angular开发人员中非常常见。这是一个简单的演示，具有“默认”行为（没有任何其他规则）和2个布局选项：column和row：

叠砖