<div class="container">
  <form [formGroup]="createForm" (ngSubmit)="onPostCreateTypeFields()" style="width:400px; margin: 0 auto;">
    <h1>Fields</h1>

    <div class="required-field-block">
        <input formControlName="name" type="text" placeholder="Fields" class="form-control">
        <div class="required-icon">
            <div class="text">*</div>
        </div>
    </div>

    <div class="required-field-block">
        <input formControlName="name" type="text" placeholder="Nome" class="form-control">
        <div class="required-icon">
            <div class="text">*</div>
        </div>
    </div>

    <mat-form-field>
        <mat-select placeholder="Type Fields" [(ngModel)]="dataSource" name="field">
          <mat-option *ngFor="let field of dataSource">
            {{field.name}}
          </mat-option>
        </mat-select>
      </mat-form-field>


    <button type="submit" class="btn btn-primary" >Criar</button>
</form>
</div>

import { Component, OnInit } from '@angular/core';
import { FieldsService } from '../Services/Fields/fields.service';
import { setTheme } from '../../../node_modules/ngx-bootstrap/utils';

@Component({
  selector: 'app-fields',
  templateUrl: './fields.component.html',
  styleUrls: ['./fields.component.css'],
  providers: [FieldsService]
})
export class FieldsComponent implements OnInit {

  selectedValue: string;
  private operUrl: 'api/Fields';
  public dataSource: Model.Itens[];

  constructor(private _fieldService: FieldsService) {
    setTheme('bs3');
  }

  ngOnInit() {

    this._fieldService
      .getAll<Model.Result>()
      .subscribe((data: Model.Result) => {
        debugger;
        this.dataSource = data.itens;
      });
  }
}

declare namespace Model{
    export interface Result{
        error: boolean;
        itens: Array<Itens>;
        message: string;
    }

    export interface Itens{
        operatorId: string;
        name: string;
    }
}

import {MatSelectModule} from '@angular/material/select';



imports: [..., MatSelectModule]