File
Extends
Metadata
| changeDetection |
ChangeDetectionStrategy.OnPush |
| selector |
cx-org-date-range-cell |
| templateUrl |
./date-range-cell.component.html |
import { ChangeDetectionStrategy, Component } from '@angular/core';
import { CellComponent } from '../cell.component';
@Component({
selector: 'cx-org-date-range-cell',
templateUrl: './date-range-cell.component.html',
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class DateRangeCellComponent extends CellComponent {
get linkable(): boolean {
return this.hasRange && (this.cellOptions.linkable ?? true);
}
get hasRange(): boolean {
return !!this.model.startDate && !!this.model.endDate;
}
}
<a
*ngIf="linkable; else text"
[routerLink]="{ cxRoute: route, params: routeModel } | cxUrl"
[tabindex]="tabIndex"
>
<ng-container *ngTemplateOutlet="text"></ng-container>
</a>
<ng-template #text>
<span
class="text"
title="{{ model.startDate | cxDate }} - {{ model.endDate | cxDate }}"
*ngIf="hasRange"
>
{{ model.startDate | cxDate }} - {{ model.endDate | cxDate }}
</span>
</ng-template>
Legend
Html element with directive