Infragistics 单选按钮更改事件未触发手动设置值

Question

我正在为我的应用程序使用 Infragistics 单选按钮，最近我们已将角度从 11 迁移到 17。我面临一个奇怪的问题。单选按钮更改事件不是第一次触发（手动设置），但如果我们通过应用程序端更改它，它工作正常。

我正在尝试通过按值更改订阅来解决问题，但我们必须传递事件参数。

HTML

        <div class="d-flex align-mode">
          <label class="title pull-left marginType">Mode</label>
          <div class="d-flex flex-column">
            <label class="radio-inline" style="margin-left: 10px">
              <igx-radio name="automaticSubmission"
                         formControlName="automaticSubmission"
                         (change)="onSubmissionModeChange($event)"
                         (click)="onSubmissionModeClick($event)"
                         value="regular"
                         id="regularSubmissionMode"
                         >Regular</igx-radio>
            </label>
          </div>
          <div class="d-flex flex-column marginFifteen">
            <label class="radio-inline ml-5 pl-4">
              <span *ngIf="automaticDisable; else enableAutomatic" (click)="showDisableMessage()">
                <igx-radio [disabled]="true"></igx-radio>
              </span>
              <ng-template #enableAutomatic>
                <igx-radio name="automaticSubmission"
                           formControlName="automaticSubmission"                               
                           (change)="onSubmissionModeChange($event)"
                           (click)="onSubmissionModeClick($event)"
                           value="automatic"
                           id="automaticSubmissionMode">Automatic</igx-radio>
              </ng-template>
              
            </label>
          </div>
        </div>
        

打字稿

 this.submissionForm = this.fb.group({
    automaticSubmission: ''
 });
        
 ngOnInit (): void {
    this.submissionForm.controls.automaticSubmission.setValue('regular');
 }
 
 onSubmissionModeChange (event) {
    alert(event.value);
    this.clearanceSubmissionFacade.setSubmissionMode(event.owner);
 }

Answer 1

我在您的标记中没有看到表单。您检查过应用程序的控制台吗？它应该记录这样的错误：

ERROR Error: NG01050: formControlName must be used with a parent formGroup directive.  You'll want to add a formGroup
      directive and pass it an existing FormGroup instance (you can create one in your class).

    Example:

    
  <div [formGroup]="myGroup">
    <input formControlName="firstName">
  </div>

  In your class:

  this.myGroup = new FormGroup({
      firstName: new FormControl()
  });

要解决此问题，请更改您的标记，如下所示：

    <form [formGroup]="submissionForm">
      <label class="radio-inline" style="margin-left: 10px">
        <igx-radio
          name="automaticSubmission"
          formControlName="automaticSubmission"
          value="regular"
          (change)="onSubmissionModeChange($event)"
          id="regularSubmissionMode"
          >Regular</igx-radio
        >
      </label>
  </form>

注意：查看 ts 文件中的代码，您正在使用一些值初始化无线电。这样，它将首先被检查，并且由于它不在单选组内，因此无法通过 UI 取消检查。