Question

我正在尝试添加一个复选框并附加到表单域。我正在使用角度7。我正在使用标签mat-form-field，为此，我遇到了错误

mat-form-field必须包含MatFormFieldControl。

我已经检查了我的组件代码，并确保FormControl存在。虽然不是很清楚，但是添加formControl“ mat-selection-list”

//DECLARE CONTROL
    preexistingControl = new FormControl('',[Validators.required]);
// CHECKBOX DATA
    preExistingCondList: PreExistingCond[] = [
            {id:'0' ,value:'None'},
            {id:'1' ,value:'Arthritis'}, 
            {id:'2' ,value:'Asthma'},];
//ADD TO FormGroup
    preexistingControl:this.preexistingControl,

HTML代码

<mat-form-field>
    <mat-selection-list #preConditions placeholder="PreExisting Conditions" [formControl]="preexistingControl">
        <mat-list-option *ngFor="let preExistingCond of preExistingCondList">
                        {{preExistingCond.value}}
        </mat-list-option>
    </mat-selection-list>
</mat-form-field>

它抛出以下错误：

ERROR Error: mat-form-field must contain a MatFormFieldControl.
    at getMatFormFieldMissingControlError (form-field.es5.js:119)
    at MatFormField.push../node_modules/@angular/material/esm5/form-field.es5.js.MatFormField._validateControlChild (form-field.es5.js:764)
    at MatFormField.push../node_modules/@angular/material/esm5/form-field.es5.js.MatFormField.ngAfterContentInit (form-field.es5.js:453)
    at callProviderLifecycles (core.js:22311)
    at callElementProvidersLifecycles (core.js:22292)
    at callLifecycleHooksChildrenFirst (core.js:22282)
    at checkAndUpdateView (core.js:23213)
    at callViewAction (core.js:23450)
    at execComponentViewsAction (core.js:23392)
    at checkAndUpdateView (core.js:23215)

我检查了formControl是否存在，并且引用ID是否正确。

Answer 1

根据https://material.angular.io/components/form-field/overview

中的文档

以下Angular Material组件被设计为可在

内部使用

b.ts

Answer 2

可以通过少量的操作来完成此操作，这适用于不支持的任何材料组件。您可以像这样将它们嵌套在mat-form-field中。

  .mat-form-field--no-underline .mat-form-field-underline {
     background-color: transparent !important;
  }

然后您需要以下CSS

JPanel

如果样式不适用，您可以使用ngdeep使其适用

错误：mat-form-field，mat-selection-list必须包含MatFormFieldControl

2 个答案: