角度形式 - 访问模板中的嵌套控件

Question

我的表单中有一个嵌套的控制组，我想访问它们的表单状态值（如pristine和valid）来动态显示验证错误。

的动态构建这样

controlMap['password'] = this.password; 
controlMap['customData'] = this.formBuilder.group(customDataControlMap); 
this.form = new FormGroup(controlMap) 

的从obj是像

{ 
    controls:{ 
    password:{} 
    --->nested 
    customData:{ 
     controls:{ 
      customerId:{} 
     } 
    } 
    } 
} 

的ngClass它看起来相当丑陋的模板

[ngClass]="(!form.controls.customData.controls.customerId.valid && !form.controls.customData.controls.customerId.touched && submitted) ? 'invalid' : ''" 

，将无法正常工作在我尝试构建它时（ng build --prod）

ERROR在 NG：///Users/hanche/Desktop/Development/selfbits/beratergruppe-leistungen-webclient/src/app/pages/clients/client-new/client-new.component.html （ 6,61）：类型'AbstractControl'上不存在属性y'控件'。

Answer 1

试试这个

form.get('customData').get('customerId')?.invalid 

或

form.get('customData.customerId') 

有没有办法避免函数模板调用？使用getter

class YourComponent { 
    get dataCustomerId() { 
    return this.form.get('customData.customerId'); 
    } 
} 

模板：

[ngClass]="dataCustomerId?.invalid" 

angular forms - accessing nested controls in template