angular - Angular 6 - 底漆必要条件

Question

我正在使用 Angular 6 中的 PrimeNg 日历组件，并且我希望实现一个带有条件的 [required] 指令。一旦我用条件设置“必需”，无论条件是什么，它总是设置为真。

<p-calendar 
  [required]="Item.status === 'In Transit'"
  [(ngModel)]="Item.actualPickup" showTime="true" 
  hourFormat="24" showSeconds="true" dateFormat="dd/mm/yy" 
  [showIcon]="true" showButtonBar="true" hideOnDateTimeSelect="true">
</p-calendar>

知道如何在模板驱动的表单中执行此操作吗？

Answer 1

动态添加或删除required属性：

<p-calendar [required]="Item.status === 'In Transit' ? '' : null">

当条件为真时，这将产生required没有值的属性（因为''）：

<p-calendar required>

否则该required属性被完全忽略（因为null）：

<p-calendar>

Answer 2

*ngIf

在您对指令没有深入了解的情况下，总是会有所帮助。

利用

<p-calendar *ngIf = "myboolean == true" 
  [required]="Item.status === 'In Transit'"
  [(ngModel)]="Item.actualPickup" showTime="true" 
  hourFormat="24" showSeconds="true" dateFormat="dd/mm/yy" 
  [showIcon]="true" showButtonBar="true" hideOnDateTimeSelect="true">
</p-calendar>

<p-calendar *ngIf = "myboolean == false" 
  [required]="Item.status = true"
  [(ngModel)]="Item.actualPickup" showTime="true" 
  hourFormat="24" showSeconds="true" dateFormat="dd/mm/yy" 
  [showIcon]="true" showButtonBar="true" hideOnDateTimeSelect="true">
</p-calendar>