类型 '{ [key: string]: AbstractControl; 上不存在属性 'xxxx'}' [英] Property 'xxxx' does not exist on type '{ [key: string]: AbstractControl; }'

问题描述

import { FormGroup } from '@angular/forms';

export class MasterVendorFormContactComponent implements OnInit {
  @Input() formContactGroup: FormGroup;
// rest of the code 
}


<fieldset [formGroup]="formContactGroup" class="master-vendor-form-contact">
  <md-input-container class="master-vendor-form-contact__phone"
                      [dividerColor]="formContactGroup.controls.phone?.valid ? 'default' : 'warn'">
    <input mdInput placeholder="Enter phone" formControlName="phone">
    <md-hint align="end"
             *ngIf="!formContactGroup.controls.phone?.valid">
      Vendor phone number must be in (XXX) XXX-XXXX format
    </md-hint>
  </md-input-container>
  <!-- Rest of the code -->
</fieldset>

使用 aot 编译此代码时出现以下错误:

on compiling this code with aot it gives following error:

angular_app/src/$$_gendir/app/master-vendors/master-vendor-form-contact/master-vendor-form-contact.component.ngfactory.ts (465,73): Property 'phone' does not exist on type '{ [key: string]: AbstractControl; }'.
angular_app/src/$$_gendir/app/master-vendors/master-vendor-form-contact/master-vendor-form-contact.component.ngfactory.ts (465,143): Property 'phone' does not exist on type '{ [key: string]: AbstractControl; }'.
angular_app/src/$$_gendir/app/master-vendors/master-vendor-form-contact/master-vendor-form-contact.component.ngfactory.ts (476,77): Property 'phone' does not exist on type '{ [key: string]: AbstractControl; }'.
angular_app/src/$$_gendir/app/master-vendors/master-vendor-form-contact/master-vendor-form-contact.component.ngfactory.ts (476,147): Property 'phone' does not exist on type '{ [key: string]: AbstractControl; }'.

我尝试采用这种方法:

不要使用form.controls.controlName，使用form.get(‘controlName’)

但是这里我有 formContactGroup 所以它似乎对我不起作用.

but here I have formContactGroup so it seems not working for me.

推荐答案

有两个选项，你可以更新到最新的 typescript 版本.由于 2.2 版，他们允许使用点符号用于具有字符串索引签名的类型.

There are two options, you can update to the latest typescript version. Since version 2.2 they allow the dot notation for types with string index signatures.

或者您可以更改您的模板，这更有意义，因为这是正确的做法:) 文档:

Or you can change your template, which makes more sense because that's the proper way to do it :) documentation:

<md-input-container [dividerColor]="formContactGroup.get('phone').valid ? 'default' : 'warn'">

这篇关于类型 '{ [key: string]: AbstractControl; 上不存在属性 'xxxx'}'的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！