标签: ngx-formly

尝试设置ngx-formly-material-file，但出现错误：装饰器不支持函数调用，但调用了“FileTypeModule”

我试图导出 FileTypeModule，但得到了同样的错误

export const fileTypeModule = FileTypeModule.forRoot();

@NgModule({
  imports: [fileTypeModule]

})

我正在与Formly合作并创建了几个自定义模板。组件中包含的唯一代码是对通用错误处理服务的调用，因此除了可以创建组件之外，实际上几乎没有什么需要测试的。我仅使用 Jest 进行单元测试，但无法弄清楚需要包含哪些内容才能成功编译组件。

我收到的错误是：TypeError：无法读取未定义的属性“formControl”。我不确定我的测试中缺少什么。

对于最简单的组件（主要是样式和指令 - 现在已删除），我有以下内容：

成分：

@Component({
  selector: 'my-formly-field-input',
  templateUrl: './formly-field-input.component.html',
  styleUrls: ['./formly-field-input.component.scss']
})
export class FormlyFieldInputComponent extends FieldType {

  constructor(private formErrorService: FormErrorHandlerService) {
    super();
  }

  getError(formItem: FormControl | FormGroup | FormArray): string {
    return this.formErrorService.getFormError(formItem);
  }

}

看法：

<mat-form-field [floatLabel]="'always'" 
                class="w-100" 
                [appearance]="'fill'">
    <mat-label>{{field.templateOptions.label}}</mat-label>
    <input matInput 
           [formControl]="formControl"
           [type]="field.templateOptions.type || 'text'"
           [step]="field.templateOptions.step || 1"
           [max]="field.templateOptions.max || undefined"/>
    <mat-error *ngIf="formControl.errors">
        {{getError(formControl)}}
    </mat-error>
</mat-form-field>

单元测试：

 describe('FormlyFieldInputComponent', () => {
  let component: FormlyFieldInputComponent;
  let fixture: ComponentFixture<FormlyFieldInputComponent>;

  const formHelperServiceStub: Partial<FormErrorHandlerService> = …

我很困惑如何使用 ngx-formly 为我的表单与字段进行布局。例如，我有 2 个字段组：General 和 Dynamic。

如何指定一般将在一个 div 中，并在一个下拉列表（div）内的另一个 div 中动态？

官方示例如下： 包装器：

 <div class="card">
      <h3 class="card-header">{{ to.label }}</h3>
      <div class="card-body">
        <ng-container #fieldComponent></ng-container>
      </div>
    </div>

成分：

fields: FormlyFieldConfig[] = [
    {
      key: 'firstName',
      type: 'input',
      templateOptions: {
        required: true,
        type: 'text',
        label: 'First Name',
      },
    },
    {
      key: 'address',
      wrappers: ['panel'],
      templateOptions: { label: 'Address' },
      fieldGroup: [{
        key: 'town',
        type: 'input',
        templateOptions: {
          required: true,
          type: 'text',
          label: 'Town',
        },
      }],
    },
  ];

而这里<ng-container #fieldComponent></ng-container>没有具体说明它是哪个字段