1

Estou a tentar fazer um calendário onde vou buscar a informação num pedido rest em angularjs. O que pretendo criar um calendário onde dê para registar os seus eventos. Com o atributo data do json ele insira esse evento e regista uma icon nesse dia.

O meu erro é como podem ver na imagem ele vai buscar um array e insere nos campos todos e não só no dia que foi registado no json. A minha função repete 42 vezes que é o número dos quadrados do calendário. Alguém sabe onde está o erro na minha abordagem é que não estou a perceber.

Imagem

inserir a descrição da imagem aqui

Json

{"data":[
    {"title":"John", 
     "start":"2016-10-22"
    }, {
     "title":"João", 
     "start":"2016-10-25"
    }
]}

controller

$scope.setDayContent = function(date) {

    return $http ({
        method : "GET",
        url : "app/components/home/controller/test_calendar.json"
      }).then(function mySucces(response) {
            console.log(response.data.data[1]);
        }, function myError(response) {
          $scope.valor = response.statusText;
      }); 

html

    <calendar-md flex layout layout-fill
          calendar-direction="direction"
          on-prev-month="prevMonth"
          on-next-month="nextMonth"
          on-day-click="dayClick"
          ng-model='selectedDate'
          week-starts-on="firstDayOfWeek"
          tooltips="tooltips"
          day-format="dayFormat"
          day-content="setDayContent"
          ></calendar-md> 

version 2:

 $scope.loadData = function(){

      return $http ({
        method : "GET",
        url : "app/components/home/controller/test_calendar.json"
      }).then(function mySucces(response) {
           $scope.jsonData = response.data.data;
        }, function myError(response) {
          $scope.valor = response.statusText;
      }); 
    }


    $scope.setDayContent = function(date, content) {


//check if $scope.jsonData contains date parameter
// return title

    }; 
2
  • O teu problema parece-me que cada dia está a chamar um pedido de ajax. Se vires na consola tens provavelmente 42 chamadas ajax, em vêz de uma só. Não conheço a API do angular para poder ajudar, mas se ninguém responder, dou uma olhada no fim de semana. +1
    – Sergio
    28/10/2016 às 15:33
  • eu preciso de criar um atributo lógico para que ele perceba que aquela data especifica só pode mostrar 1 vez e não as 42 vezes. Acho que é isto, Corrige-me se tiver errado 28/10/2016 às 15:36

1 Resposta 1

0

Já entendi o ponto que está gerando esse loop de busca.

O seu setDayContent é chamado pelo componente para você poder informar o conteúdo do dia, porém você não está tratando os parâmetros passados pelo componente e buscando do dia que ele pediu, mas retornando todo o calendário.

Sugestão: Tratar o seu setDayContent para buscar na requisição apenas o dia que ele pediu, que está nos parâmetros que o componente te envia.

Ou, carregar os eventos antes de carregar o componente e no seu setDayContent você procura nesse array ou objeto de eventos já carregados pela data que ele te requisitou via parâmetro.

E é bom você voltar lá na página do componente que você está usando e ler melhor a documentação dele.


UPDATE

Então cara, eu dei uma olhada na documentação.

É isso mesmo, seu erro é não filtrar a data que o componente pediu. O componente te da a opção de responder com html, ou com uma promise.

4
  • o problema é que não há documentação para esta parte. Mas eu criei agora uma função antes do setdaycontent com o pedido get ao json e dentro do setdaycontent vou tentar buscar apenas a data 28/10/2016 às 15:54
  • vou editar o meu código e diz me se estou a ir pelo um bom caminho eu não estou a perceber. 28/10/2016 às 16:59
  • Giovane, coloca por favor uma sugestão de como o código deveria ser para resolver o problema. @JoseCerejo por favor não mudes a pergunta para adaptar às respostas que vão surgindo. Senão fica a pergunta e a resposta sem sentido.
    – Sergio
    28/10/2016 às 17:24
  • @Sergio não vou por código pq nunca trabalhei com esse componente, e a solução é simples. O seu setDayContent tem que responder a data que o componente pede, pronto, faça com que responda.
    – Giovane
    28/10/2016 às 17:47

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .