在建立一個表單時，出現了這樣的錯誤：

原因是，在最外層的form中使用了 formGroup 指令，但在下面的某個input 外掛中，使用了ngModel 指令，但沒有加入formControl 指令或 formControlName 屬性。

 1   <form [formGroup]="form">
 2     <mat-form-field>
 3       <input matInput placeholder="IP(SNMP)" [formControl]="snmpIpCtrl" required>
 4       <
 
mat-error *ngIf="snmpIpCtrl.hasError('required')">IP(SNMP)不能為空</mat-error>
 5       <mat-error *ngIf="snmpIpCtrl.hasError('pattern')">請輸入有效的IP地址</mat-error>
 6     </mat-form-field>
 7     
 8     <div>
 9       <p>是否支援Netconf</p>
10       <mat-radio-group 
 
[(ngModel)]="netconfFlag">
11         <mat-radio-button value="0" color="primary">支援</mat-radio-button>
12         <mat-radio-button value="1" color="primary">不支援</mat-radio-button>
13       </mat-radio-group>
14     </div>
15 </form>

解決方法：

1. 在input元素中新增 formControl 指令或 formControlName 屬性

1 <div>
2       <p>是否支援Netconf</p>
3       <mat-radio-group [(ngModel)]="netconfFlag" [formControl]="netconfFlagCtrl">
4         <mat-radio-button value="0" color="primary">支援</mat-radio-button>
5         <mat-radio-button value="1" color="primary">不支援</mat-radio-button>
6       </mat-radio-group>
7 </div>

並在相應的component.ts 中定義用於驗證的FormControl。

2. 新增 ngModelOptions 指令

1     <div>
2       <p>是否支援Netconf</p>
3       <mat-radio-group [(ngModel)]="netconfFlag" [ngModelOptions]="{standalone: true}">
4         <mat-radio-button value="0" color="primary">支援</mat-radio-button>
5         <mat-radio-button value="1" color="primary">不支援</mat-radio-button>
6       </mat-radio-group>
7     </div>