define own calendar animation
Keke edited this page Mar 5, 2020
·
2 revisions
<input angular-mydatepicker [(ngModel)]="model" [options]="myDatePickerOptions"
#dp="angular-mydatepicker">
import {IAngularMyDpOptions, CalAnimation} from 'angular-mydatepicker';
export class MyApp {
myDatePickerOptions: IAngularMyDpOptions = {
dateFormat: 'dd.mm.yyyy',
calendarAnimation: {in: CalAnimation.Own, out: CalAnimation.Own},
stylesData: {
selector: 'dp1',
styles: `
.dp1 .myDpAnimationOwnIn {
animation: myDpAnimationOwnIn 0.3s linear;
}
@keyframes myDpAnimationOwnIn {
0% {
// add in animation here
}
100% {
// add in animation here
}
}
.dp1 .myDpAnimationOwnOut {
animation: myDpAnimationOwnOut 0.3s linear forwards;
}
@keyframes myDpAnimationOwnOut {
0% {
// add out animation here
}
100% {
// add out animation here
}
}
`
}
// other options here
}
constructor() {}
}