DatePicker только с месяцем и днем ​​(Скрыть год) - PullRequest
0 голосов
/ 08 апреля 2019

Я не могу найти какой-либо документированный способ скрыть год на сборщике даты ngx-bootstrap.Я попытался dateInputFormat: 'MMDD', но год все еще показывает в заголовке DatePicker.Ссылка на документацию: https://valor -software.com / ngx-bootstrap / # / datepicker Я бы хотел показать что-то вроде: datepicker

1 Ответ

1 голос
/ 08 апреля 2019

хорошо, дело в использовании инкапсуляции: ViewEncapsulation.None и такого класса, как

.bs-datepicker-head button:nth-child(3){
  display:none!important;
}

Проблема с ViewEncapsultaion.None заключается в том, что все ваши компоненты .css влияют на все приложение. Так что лучше напишите .css вроде

.custom .bs-datepicker-head button:nth-child(3){
  display:none!important;
}

Таким образом, если мы используем ViewEncapsultaion.None, влияет только на средство выбора даты, которое имеет класс "custom". Чтобы создать DatePicker с настраиваемым классом, вам нужно использовать [bsConfig].

Я пишу код

Наш .html

<div class="content">
  <h4>datepicker should display current date:</h4>
  <div class="row">
    <div class="col-xs-12 col-12 col-md-4 form-group">
      <input type="text"
            class="form-control"
            [minDate]="minDate"
            [maxDate]="maxDate"
            #dp="bsDatepicker" [bsConfig]="bsConfig"
            bsDatepicker [(bsValue)]="myDateValue">
    </div>
  </div>
</div>

И наш компонент

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  encapsulation: ViewEncapsulation.None
})
export class AppComponent implements OnInit {
  myDateValue: Date;
  bsConfig: Partial<BsDatepickerConfig>;
  ngOnInit() {
    this.myDateValue = new Date();
    //see that our class was "theme-green custom"
    this.bsConfig = Object.assign({}, { containerClass: 'theme-green custom' });
  }
}

Вы можете увидеть в стекаблиц

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...