angularJs カレンダーで問題に直面しています。基本的に私はAngular-UIカレンダーを使用しているので、このコントローラーで「CalendarController」というコントローラーを作成しましたサービスを呼び出し、ajax呼び出しを使用してデータを取得しています...しかし、なぜそれが起こっているのかわかりません。カレンダー構成行に直接入力してから、サービス ajax 呼び出しに進みます。誰でもこれに対する解決策を見つけることができます。
目標: コントローラーの呼び出しを優先する必要があります。たとえば、2 つのコントローラー Ctrl1 と Ctrl2 がある場合、Ctrl2 を呼び出したい場合は、Ctrl1 が呼び出します。
'use strict';
/* Controllers */
angular.module('myApp', ['myApp.services','myApp.directives','myApp.filters','ui.bootstrap', '$strap.directives']).
controller('navCtrl', function($scope) {
console.log("### navController");
}).
controller('ContactController', function($scope, contactFactory) {
console.log("### ContactController is called");
/**
* Getting Contact detail
**/
$scope.contacts = [];
contactFactory.getContacts().success(function(response){
$scope.contacts = response.data;
console.log("### Getting Contact data");
console.log($scope.contacts);
});
}).
controller('ActivityController', function($scope, activityFactory) {
$scope.oneAtATime = true;
$scope.loading = true;
activityFactory.getNotifications().success(function(response){
var activityData = [];
var total = parseInt(response.data.length);
for (var i=0; i<total; i++)
activityData.push(response.data[i].desc);
$scope.activities = activityData;
console.log("### Getting Activity data");
console.log($scope.activities);
$scope.loading = false;
});
}).
controller('CalendarController', function($scope, contactFactory, calendarFactory) {
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
/* event source that pulls from google.com */
$scope.eventSource = {
editable: true,
className: 'gcal-event', // an option!
currentTimezone: 'America/Chicago' // an option!
};
/* event source that contains custom events on the scope */
/**
* Getting Staff detail
**/
$scope.staff = [];
var staffDetail = {};
contactFactory.getStaff().success(function(response){
var staffData = response.data;
if(staffData!=null) {
var total = parseInt(staffData.length);
for (var i=0; i<total; i++) {
staffDetail = {
'id': staffData[i].staffId,
'name': staffData[i].name,
};
$scope.staff.push(staffDetail);
}
}
console.log("### Getting Staff data");
console.log($scope.staff);
});
var calDailyEvents = {};
$scope.events = [];
calendarFactory.getCalendarDailyEvents().success(function(response){
var eventData = response.data;
console.log("### getCalendarDailyEvents");
if(eventData!=null) {
var total = parseInt(eventData.length);
for (var i=0; i<total; i++) {
var totalStaff = eventData[i].eventAssignedToForms.length;
var staffIds = [];
for(var j=0;j<totalStaff;j++) {
staffIds.push(eventData[i].eventAssignedToForms[j].contactId);
}
console.log(staffIds);
calDailyEvents = {
'id': eventData[i].id,
'title': eventData[i].eventName,
'start': Date(eventData[i].startDate),
allDay: false,
resource: staffIds
};
$scope.events.push(calDailyEvents);
}
}
console.log("### Getting DailyEvents data");
console.log($scope.events);
});
/* event source that calls a function on every view switch */
$scope.eventsF = function (start, end, callback) {
/*Commented for testing purpose*/
/* var s = new Date(start).getTime() / 1000;
var e = new Date(end).getTime() / 1000;
var m = new Date(start).getMonth();
var events = [{title: 'Feed Me ' + m,start: s + (50000),end: s + (100000),allDay: false, className: ['customFeed']}];
callback(events); */
};
/* alert on eventClick */
$scope.alertEventOnClick = function( calEvent, jsEvent, view ){
$scope.$apply(function(){
$scope.alertMessage = ('Event: ' + calEvent.title);
$scope.alertMessage += ('View: ' + view.name);
});
};
$scope.onEventRender = function(event, element) {
console.log("### onEventRender");
};
$scope.onDayClick = function( date, allDay, jsEvent, view ){
$scope.$apply(function(){
$scope.alertMessage = ('Day Clicked ' + date);
});
//$scope.$popover();
};
/* alert on Drop */
$scope.alertOnDrop = function(event, dayDelta, minuteDelta, allDay, revertFunc, jsEvent, ui, view){
$scope.$apply(function(){
$scope.alertMessage = ('Event Droped to make dayDelta ' + dayDelta);
});
};
/* alert on Resize */
$scope.alertOnResize = function(event, dayDelta, minuteDelta, revertFunc, jsEvent, ui, view ){
$scope.$apply(function(){
$scope.alertMessage = ('Event Resized to make dayDelta ' + minuteDelta);
});
};
/* add and removes an event source of choice */
$scope.addRemoveEventSource = function(sources,source) {
var canAdd = 0;
angular.forEach(sources,function(value, key){
if(sources[key] === source){
sources.splice(key,1);
canAdd = 1;
}
});
if(canAdd === 0){
sources.push(source);
}
};
/* add custom event*/
$scope.addEvent = function() {
$scope.events.push({
title: 'Open Sesame',
start: new Date(y, m, 28),
end: new Date(y, m, 29),
className: ['openSesame']
});
};
/* remove event */
$scope.remove = function(index) {
$scope.events.splice(index,1);
};
/* Change View */
$scope.changeView = function(view) {
$scope.myCalendar.fullCalendar('changeView',view);
};
/* config object */
$scope.uiConfig = {
calendar:{
height: 450,
editable: true,
header:{
left: 'prev,next',
center: 'title',
right: 'resourceDay, agendaWeek, resourceWeek',
},
resources: $scope.contacts,
allDaySlot: false,
defaultView: 'resourceDay',
dayClick: $scope.onDayClick,
eventClick: $scope.alertEventOnClick,
eventDrop: $scope.alertOnDrop,
eventResize: $scope.alertOnResize,
eventRender: $scope.onEventRender
}
};
console.log($scope.contacts);
/* event sources array*/
$scope.eventSources = [$scope.events, $scope.eventSource, $scope.eventsF];
});