(全日历)使用后端信息自动单击天数

Question

我需要我的全日历自动点击两个日期，这就是我如何让我的一天点击：

 dayClick: function (date) {
    if ($(this).css('background-color') == 'rgb(33, 115, 240)') {
      $(this).css({
        'background-color': 'white'
      })
    } else {
      $(this).css({
        'background-color': '#2173f0'
      })
    }
  }

它工作正常，当我单击

一天时，该天变为蓝色，当我再次单击它时，它变为白色。问题是，我的用户在<input>标签中选择两天，当选择这些日子时，我需要完整日历来自动单击这些日子，所以它们变成蓝色。

这个想法是这样的：

首先，您将看到一个字段，您可以在其中输入两天，
全日历将响应并将那些日子变成蓝色，
然后，您将使用完整日历本身选择其他一些日期

我写了这样的东西：

  sendDate(val: any) { //this method will be called the the inputs are filled
    var dataIni =val.metasForm.value.gesMetasDtini;
    var dataFim =val.metasForm.value.gesMetasDtfim;
    //this gets the dates
    if (dataIni != null && dataFim != null) {
     $("#calendar").dayClick(dataIni);
     $("#calendar").dayClick(dataFim);
    }
  }

问题是，这并没有真正让那些日子变蓝。我还有其他方法吗？

编辑：更多代码

日历：

<div id="form-group" class="left" style="width: 90%">
            <ng-fullcalendar id="calendar"></ng-fullcalendar>
        <br><br>
</div>

输入：

<div id="form-group" class="left">
    <input id="ini" placeholder="Data de Início" type="text" 
        formControlName="gesMetasDtini" class="form-control" (change)="sendDate(this)">
    <br>
</div>
<div id="form-group" class="right">
    <input id="fim" placeholder="Data de Fim" type="text" 
    formControlName="gesMetasDtfim" class="form-control" (change)="sendDate(this)">
    <br>
</div>

方法：

$('#calendar').fullCalendar({
  //selectable: true,
  header: {
    left: 'prev,next today',
    center: 'title',
    right: ''
  },
  dayClick: function (date) {
   // var DiaSemana = date._d.toString();
   // DiaSemana = DiaSemana.substring(0, 3);
   // if (DiaSemana == 'Sat' || DiaSemana == 'Fri') {
   //   console.log('fim de semana')
   // }
    if ($(this).css('background-color') == 'rgb(33, 115, 240)') {
      $(this).css({
        'background-color': 'white'
      })
    } else {
      $(this).css({
        'background-color': '#2173f0'
      })
    }
  }
});

Answer 1

从你的代码：

$("#calendar").dayClick(

。fullCalendar中没有记录这样的方法，所以我不确定你从哪里得到使用它的想法。只有您已经知道的dayClick回调。

相反，您必须以 HTML 元素本身为目标。幸运的是，此元素具有描述今天是哪一天的数据。所以像

$('.fc-day[data-date="2019-01-05"').css("background-color", "blue"); 

会工作。下面是每次呈现视图时运行该代码的演示：http://jsfiddle.net/7nsbjya5 .

您现在需要做的就是以合适的方式将其与您的<input>控件集成，以满足您的要求。