I am using v2.0.1 of ngx-bootstrap in my project. I am trying to configure the datepicker to disable certain days. The config option is dayDisabled. This feature was implemented in v2.0.0 of ngx-bootstrap. https://github.com/valor-software/ngx-bootstrap/pull/2744/files The way I am implementing it is not picking it up.
<div class="row">
<div class="col-xs-12 col-12 col-md-4 form-group">
<input
class="form-control"
placeholder="Datepicker"
bsDatepicker
[bsConfig]="{ dayDisabled: '[0,1,2,3]', containerClass: 'theme-red' }">
</div>
</div>
You can use BsDatepickerConfig
:
dayDisabled: [0, 1, 2]
into bsConfig
or
dayDisabled: '[0,1,2,3]' = dayDisabled: [0,1,2,3]
https://valor-software.com/ngx-bootstrap/#/datepicker#themes
import { Component } from '@angular/core';
import { BsDatepickerConfig } from 'ngx-bootstrap/datepicker';
@Component({
selector: 'demo-datepicker-color-theming',
templateUrl: './color-theming.html'
})
export class DemoDatepickerColorThemingComponent {
colorTheme = 'theme-green';
bsConfig: Partial<BsDatepickerConfig>;
applyTheme(pop: any) {
// create new object on each property change
// so Angular can catch object reference change
this.bsConfig = Object.assign({}, { containerClass: this.colorTheme, dayDisabled: [0, 1, 2] });
setTimeout(() => {
pop.show();
});
}
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.