html - Angular 4 Material组件订购

Question

前端技术的 super 初学者我正在使用一些 Material 组件开发 Angular 4 应用程序。我试图在一行中显示我所有的 Material 组件。但是我找不到像 mat-group-element 这样的 Material 指令，这是我目前的代码:

我的 main-component.css :

 .sqltool-input {
    display:inline-block
  }

  .sqltool-select {
    display:inline-block
  }

  .sqltool-toggle {
    display:inline-block
  }

我的main-component.html:

<form class="sqltool-form">
   <!-- COMPONENT 1 -->  
   <mat-form-field class="sqltool-matform">
     <input class="sqltool-input" matInput placeholder="Enter SQL request">

    <!-- COMPONENT 2 --> 
    <mat-select class="sqltool-select" placeholder="Base" [(ngModel)]="dataSource">
        <mat-option value="Base1">Base 1</mat-option>
        <mat-option value="Base2">Base 2</mat-option>
    </mat-select>

    <!-- COMPONENT 3 --> 
    <mat-slide-toggle class="sqltool-toggle" [checked]="checked" color="primary">
        File generation
    </mat-slide-toggle>
  </mat-form-field>
</form>

有什么想法吗？

Answer 1

如 documentation 中所述;只有三种 Material 组件设计用于在 mat-form-field 内工作:

• 输入matInput & textarea matInput
• 垫选择
• 垫片列表