Angular 如何将FormControl与p-calendar一起使用并覆盖占位符

是我正在查看的表单控件列表：

我有两种模式（单选按钮）正确和错误。两者都适用于一个

p-calendar

：

<p-calendar
  [formControl]="startFormControl"
  [(ngModel)]="startValue"
  placeholder="MM-DD-YYYY">
</p-calendar>

问题是值没有被更改，这就是它抛出

null

的原因。请在此提出建议

---

注：实际代码太复杂，无法在stackblitz或plunker上重新创建。

我已经在上重新创建了场景

您只需在单选按钮的

change

事件上启用/禁用日历即可

您可以看到，我已经在您的模式（单选按钮选择）更改时将日期记录到控制台中。日期在任何时候都不会变为空

---

因此，您不需要使用占位符。

因此，我预计，您的主要问题是无法检测到

p-calendar

值的变化。如果下面的代码=>

this.firstName.valueChanges.subscribe(value => {
         console.log('name has changed:', value)
       }); 

如果不工作，则可以尝试

ngModelChange

。以下是我针对

ngModelChange

和

valueChanges.subscribe

=>
HTML

 <form [formGroup]="formGroup" >
    <p-calendar [formControl]="firstName"
      [(ngModel)]="startValue"
      (ngModelChange)="datachanged($event)"
      placeholder="MM-DD-YYYY">
    </p-calendar>
    </form>

注意：演示链接。请检查链接并让我知道

 <form [formGroup]="formGroup" >
    <p-calendar [formControl]="firstName"
      [(ngModel)]="startValue"
      (ngModelChange)="datachanged($event)"
      placeholder="MM-DD-YYYY">
    </p-calendar>
    </form>

export class AppComponent {

    formGroup: FormGroup;
    firstName = new FormControl();
    constructor(formBuilder: FormBuilder) {
        
      this.firstName.valueChanges.subscribe(value => {
         console.log('name has changed:', value)
       });  
    }
   
  datachanged($event) {
    console.log("changed detected:"+$event);
  }

}