Javascript 如何在Angular 5中的[formControl]处设置变量？

我有这样的界面

export interface IFilterParams {
    columnTitle: string;
    key: string;
    mode: FILTER_MODE;
    compareMethod: COMPARE_METHOD;
    keyToCheck?: string;
    sliderKeys?: string[];
    startingValue?: number;
    placeHolder?: string;
    cssClass?: string;
    formControl?: string;
}

countryForm: FormControl = new FormControl();

我用它来创建html（过滤表单），如下所示

<div [ngClass]="(filter.cssClass || 'col-md-4') + 'mt-2 pt-1'">
                  <div class="filter-key-label">
                      {{filter.columnTitle}}
                  </div>
                  <div class="filter-form-control d-flex flex-wrap justify-content-left">
                    <mat-form-field class="full-width">
                      <input type="text" matInput [formControl]="filter.formControl" [matAutocomplete]="auto" (change)="handleEmptyInput($event, filter.key)">
                        <mat-autocomplete #auto="matAutocomplete">
                          <mat-option *ngFor="let option of getOptionsTypeAhead(filter.key, filter.formControl) | async" [value]="option" (onSelectionChange)="typeaheadChange($event, filter.key)">
                            {{ option }}
                          </mat-option>
                        </mat-autocomplete>
                      </mat-form-field>
                  </div>

我做错了什么？我想使用相同的html生成具有不同表单控件名称的不同表单

更新 即使像这样在我的component.ts文件中添加了直接基于字符串的变量，这也不起作用

export interface IFilterParams {
    columnTitle: string;
    key: string;
    mode: FILTER_MODE;
    compareMethod: COMPARE_METHOD;
    keyToCheck?: string;
    sliderKeys?: string[];
    startingValue?: number;
    placeHolder?: string;
    cssClass?: string;
    formControl?: string;
}

countryForm: FormControl = new FormControl();

---

您正在使用

[formControl]=“filter.formControl”

将字符串对象传递给formControl属性：

但您需要传递一个FormControl对象：

countryForm: FormControl = new FormControl();

filter = {
    ...
    formControl: this.countryForm,
}

---

你是后端吗？？i、 我问题的更新部分是你现在唯一需要的部分