Conforme detalhado em uma pergunta anterior , estou usando o Angular Bootstrap Calendar e, de acordo com a documentação, tenho a diretiva config e o controlador configurados para poder personalizar os dados dentro de cada célula. Aqui está o controlador:
(function() {
angular.module('myApp')
.controller('calendarController', function($scope, $state, moment, calendarConfig, $http, Formio, shiftService) {
var vm = this;
calendarConfig.templates.calendarMonthCell = 'views/calendar/dayTemplate.html';
calendarConfig.dateFormatter = 'moment';
vm.events = [];
vm.calendarView = 'month';
vm.viewDate = moment().startOf('month').toDate();
var startDate = moment(this.viewDate).toISOString();
var endDate = moment(this.viewDate).endOf('month').toISOString();
var endpoint = 'https://abcdefghijklmno.form.io/shift/submission';
var token = Formio.getToken();
var shifts = shiftService.getShiftsMonth(token, startDate, endDate);
vm.cellModifier = function(cell, shifts) {
cell.text = 'Test Text';
//console.log(cell);
};
$scope.$on('$destroy', function() {
calendarConfig.templates.calendarMonthCell = 'mwl/calendarMonthCell.html';
});
});
})();
e meu serviço para obter os dados.
(function() {
angular
.module('myApp')
.service('shiftService', shiftService);
shiftService.$inject = ['$http'];
function shiftService($http) {
var getShiftsMonth = function (token, startDate, endDate) {
var config = {
headers: {
'x-jwt-token' : token
},
params: {
'date.date__gte': startDate,
'date.date__lte': endDate
// limit: 10
}
};
return $http.get('https://abcdefghijklno.form.io/shift/submission', config)
.then(function(response) {
return response.data;
});
};
var addNameToShift = function(locationid) {
return $http.get('/my/url/' + locationid);
};
return {
getShiftsMonth: getShiftsMonth,
addNameToShift: addNameToShift
};
}
})();
Eu obtenho os dados personalizados de um endpoint de API, então o que eu quero fazer é obter todos os dados de todo o mês em uma chamada e, em seguida, passá-los para a função modificadora de célula (não quero ter que atingir meu endpoint de API Cerca de 30 vezes diferentes quando um mês é visualizado). No entanto, como cellModifier é chamado do serviço calendarHelper, não vejo nenhuma maneira de passar os dados retornados para a função cellModifier. Preciso apenas adicioná-lo a $ rootScope no controlador para que esteja disponível no modificador ou há uma maneira melhor de colocar esses dados lá?
Obrigado.
Depois de brincar um pouco mais com isso e obter uma resposta de Matt Lewis, parece que a matriz de eventos é a única maneira de colocar os dados na célula e, a partir daí, você pode adicionar dados conforme necessário. Consegui fazê-lo funcionar reescrevendo um pouco meu controlador:
var onShifts = function(data) {
vm.events = data;
};
var onError = function(error) {
vm.error = 'There was an error.';
};
shiftService.getShiftsMonth(token, startDate, endDate)
.then(onShifts, onError);
vm.cellModifier = function(cell) {
cell.shifts = this.events;
};
Este artigo é coletado da Internet.
Se houver alguma infração, entre em [email protected] Delete.
deixe-me dizer algumas palavras