Attribute | Value | Desription |
---|---|---|
fname | Field name | Field Name |
lable | truthly value | removes floating label |
no-floating-label | form control name | form control name |
ng-Model | ng-Model | ng-Model value here |
mode | select mode either date or dateTime | date or date-time |
format | date format | Moment Js accepted date format |
divider | Divider between two dates | Defalt value is 'To' |
is-required | is field is required | True or false |
show-custom | start range picker with custome date mode | True or false |
custom-to-home | Go back to Defualt view from Custom view | True or false |
on-range-select | call back function that return selected range as object with startDate and endDate | on-range-select="vm.yourCallbackFun(date)" |
custom-list | Override specific range picker instance default list using this attribute | pass array of object like this [ { position:index, label:'new label name', startDate: start Date moment Object(), endDate: End Date moment Object() }] |
<sm-range-picker-input
fname="joiningDate"
lable="Date of Joining"
form="empForm"
value="vm.employee.joiningDate"
flex-size="100"
is-required="{{true}}"
format="MM-DD-YYYY"
on-range-select="vm.yourCallbackFun(date)"
divider="To">
</sm-range-picker-input>
<sm-range-picker-input
fname="joiningDate"
lable="Date of Joining"
form="empForm"
value="vm.employee.joiningDate"
flex-size="100"
is-required="{{true}}"
format="MM-DD-YYYY"
custom-to-home="'true'"
show-custom="'true'"
divider="To">
</sm-range-picker-input>
<sm-range-picker-input
fname="joiningDate"
lable="Date of Joining"
form="empForm"
value="vm.employee.joiningDate"
flex-size="100"
is-required="{{true}}"
format="MM-DD-YYYY"
custom-to-home="'true'"
show-custom="'true'"
custom-list="vm.overrideList"
divider="To">
</sm-range-picker-input>
app.controller('YourControllerName',function(){
vm.overrideList = [{
position:1,
label:'Custom',
startDate: moment(),
endDate: moment()
}]
});