How to set attribute value in p-calendar angular?

Question

I am using p-calendar for date selection. Now, I want to set class attribute on condition bases. For set attribute I am using setElementAttribute function but its giving me error 'vendor.bundle.js:70655 TypeError: Cannot read property 'setAttribute' of undefined '. It works in normal input or select tag but not in p-calendar tag.

This is HTML code

<p-calendar [showIcon]="true" 
            name="date" 
            id="dateId" 
            #date 
            [(ngModel)]="dateValue"
            [required]="isRequired" 
            autoClear="true" 
            (onSelect)="selectedDate(date.value)" 
            [ngModelOptions]="{standalone: true}" 
            (data)="refreshValue($event)" 
            dateFormat="mm/dd/yy" 
            hourFormat="24">
</p-calendar>

This is ts file code

@ViewChild('date ') date : any;

selectedDate(date) { 

    if (date != null) { 

          this._renderer.setElementAttribute(this.date.nativeElement, 'class', 'form-control ng-pristine ng-valid ng-touched');
      } else {
        if(this.isRequired){
          this._renderer.setElementAttribute(this.date.nativeElement, 'class', 'form-control ng-touched ng-dirty ng-invalid');
          this.Flag = false;
        }
      }
  }

This is error