Angularjs 完整日历'；s day点击日期时不触发

我要做的。点击日历中的某一天，并在其下方区域显示该天事件的详细信息

我是如何做的。使用Angular和ui日历指令。在FullCalendar的

dayClick

事件中，我正在创建一组当天发生的新事件。在模板中，我正在执行一个典型的

ng repeat=“event In daysEvents”

div。当我在

ionic serve

中测试它时，它工作得非常好

问题。当我将应用程序发送到我的设备（使用

ionic run iOS

）或Chrome开发者工具“切换设备模式”时，

dayClick

事件在iOS模拟器中不起作用

代码。这是我的控制器：

angular.module('starter.controllers', ['ui.calendar'])

.controller('CalendarCtrl', function($scope) {
  $scope.eventSources = [
    {
    title: "Spring Awards Night",
    start: moment("2015-5-19 18:30"),
    description: "The Spring Awards are awesome and you should come."
    }
  ]

  $scope.uiConfig = {
    calendar:{
      height: 'auto',
      editable: false,
      header:{
        left: 'prev',
        center: 'title',
        right: 'next'
      },
      dayClick: function(date, jsEvent, view) {
        $scope.daysEvents = $scope.eventSources.filter(function(event){
          return event.start.isBetween(date, moment(date).add(1, 'days'));
        });
        $(".fc-day").removeClass("fc-selected");
        $(this).addClass("fc-selected");
      }
    }
  };

以及我的模板的一部分：

<div ui-calendar="uiConfig.calendar" ng-model="eventSources"></div>

---

如果你还需要什么，请告诉我。提前感谢。

在FullCalendar中，如果当天拖动，则会触发

dayclick

事件

其他设备会在您点击当天的内容时触发

dragstart

和

dragend

事件，但iOS设备不会

我别无选择，只能修改fullcalendar.js。您可以在此处看到我的修改版本：

---

第一个解决方案：

只有在将UI日历（FullCalendar）与Ionic一起使用时才会发生这种情况，因为Ionic会捕获所有点击事件。这就是为什么它适用于桌面浏览器，但不适用于移动浏览器

要解决此问题，请向UI日历指令添加

data-tap-disabled=“true”

，如下所示：

<div data-tap-disabled="true" ui-calendar="uiConfig.calendar" ng-model="eventSources"></div>

---

是的。我添加了更多的模板和控制器代码。我还发现当使用Chrome开发者工具的“切换设备模式”时，它不起作用。Do inspect元素，在浏览器控制台的左上角，你会看到一个移动图标，单击它，在左上角，你会再次看到一个标题设备选择你想要使用的手机型号，然后刷新：）右。这是它不工作的视图（使用任何设备选项）。它在非设备模式（普通浏览器窗口）下工作得非常好。

function onViewRender( view, element ){
  // 1. Add tap listeners for each day (in my case - the date number element)
  var matches = document.querySelectorAll(".fc-day-number");

  _.forEach(matches, function(element){
    $ionicGesture.on('tap', function (event) {

      // 2. On tap - parse data-date attribute from the element
      var selectedDateStr = $(event.target).attr('data-date');

      // 3. And select an according day with uiCalendarConfig select method
      uiCalendarConfig.calendars.mobileCal.fullCalendar('select', moment(selectedDateStr), moment(selectedDateStr).add(24,'h'));
    }, angular.element(element));
  });
}