Solucionado (ver solução)
Solucionado
(ver solução)
14
respostas

Descrição do grupo no painel de fotos

Como seria a melhor maneira de pegar a descrição do grupo e colocar na tela inicial? Porque se vc faz uma referencia ao grupo, ele só tem o _id gravado no banco e eu gostaria de mostrar a descrição do grupo no painel de fotos. Obrigado!

14 respostas

Olá Mariana. Nesse caso o backend deve ser alterado para devolver a foto com um objeto Grupo e todas as suas informações. No lado do Angular não há muito que fazer, é no design da API mesmo.

Flavio, tentei fazer aqui e não consegui. Até consegui fazer um backend que devolve o nome do grupo, fazendo um "buscaPorId" que devolve o nome no /v1/grupos/:idGrupo mas o problema seria como referenciar isso no $scope e ser mostrado o nome, e não o _id do grupo. Se tiver algum exemplo, mesmo na internet de como resolver isso, ficaria grata!

Obrigado pela atenção!

No caso sua API deve ser programada para retornar os dados que precisa. Como é um curso de Angular, a parte de API foi dada pronta. Todavia, na própria alura, há cursos de criação de API REST. Inclusive esse padrão é agnóstico de tecnologia, você pode implementá-lo em java, node, php e em qualquer linguagem.

Como disse, não há nada que você possa fazer no lado do Angular no backend que lhe foi fornecido, porque ele não traz essa informação. Só alterando o backend mesmo. Tipo, quando acessar /v1/fotos ele deve retornar a foto com o objeto grupo, inclusive o nome e o ID.

Cursos que podem ajudá-la a desenvolver essa parte de backend são

https://cursos.alura.com.br/course/webservices-rest-com-jaxrs-e-jersey

https://cursos.alura.com.br/course/webservice-rest-api

Mas escolha aquela tecnologia que você se familiarizar.

Aahh é que coloquei a pergunta no tópico errado...a dúvida surgiu depois do curso de MEAN Stack. Mas obrigado Flávio! Vou pesquisar sobre esse cursos que vc citoou! Obrigado!

Uma solução que você pode fazer, paliativa enquanto domina a parte de backend é fazer um if lá no template e testar que se o id por igual 1, você exibe o nome do grupo X, se for igual 2, você exibe o nome y. Assim:

<h2  ng-if="foto..grupo == 1">Grupo1 </h2>
<h2  ng-if="foto..grupo == 2">Grupo1 </h2>
<h2  ng-if="foto..grupo == 3">Grupo1 </h2>

Dessa forma você não precisa entrar na parte tensa do backend.

Ah, você esta se referindo ao curso de MEAN? É isso?

Se for.. a resposta muda :)

kkkkk! exato! Fiz a pergunta no tópico errado! ERa sobre o curso de MEAN Stack! Refaço a pergunta lá então???

Vou te responder por aqui mesmo.

solução!

Vou passar uma visão geral, tudo bem? Vamos lá.

Hoje seu esquema de foto é assim:

var mongoose = require('mongoose');

var schema = mongoose.Schema({

    titulo: {
        type: String,
        required: true
    },
    url: {
        type: String,
        required: true
    },
    grupo: {
        type: Number,
        required: true
    }
});

mongoose.model('Foto', schema);

A ideia é que a propriedade grupo guarde o object ID do schema de um Grupo. Para isso, você precisará criar o esquema do grupo.

Um exemplo:

var mongoose = require('mongoose');

var schema = mongoose.Schema({

    nome: {
        type: String, 
        required: true
    }
});

mongoose.model('Grupo', schema);

O macete agora é o seguinte. No esquema de foto você guarda o object ID do grupo, que é o seu identificador único criado pelo Mongoose. (você precisará criar um grupo no seu banco para que ele preencha esse ID especial).

Agora você vai ensinar para o Mongoose que ele deve relacionar grupo com foto. Toda vez que você obter uma foto ele buscará já o objeto grupo como um todo, ou seja, você poderá fazer foto.grupo.nome ou foto.grupo._id.

Seu modelo de foto ficará assim:

var mongoose = require('mongoose');

var schema = mongoose.Schema({

    titulo: {
        type: String,
        required: true
    },
    url: {
        type: String,
        required: true
    },
    grupo: {
        type: mongoose.Schema.ObjectId, 
         ref: 'Grupo' 
    }
});

mongoose.model('Foto', schema);

O pulo do gato esta aqui:

    grupo: {
        type: mongoose.Schema.ObjectId, 
         ref: 'Grupo' 
    }

Você fez uma associação através do Mongoose. Agora, toda vez que obter uma foto, obterá o grupo como um todo. Mas você precisará adequar todo o restante da sua aplicação. Por exemplo, quando selecionar um grupo, não salvara o ID dele na foto, salvará o grupo inteiro.

Vale lembrar que no banco, continuará sendo salvo apenas o ID do grupo, mas na hora de obter os dados o Mongoose fará o relacionando para você automaticamente.

Alterei a categoria do post.

Muito legal Flávio! Entendi perfeitamente! Obrigado pela explicação!

Só uma correção. No Angular, você continua salvando na foto o _id do grupo. Ok? Na hora de gravar, grava o object _id. Eu tinha dito que era para gravar o objeto inteiro, mas não é isso não. É muita pergunta sendo respondida no fórum, tem hora que dá curto! :)

Qualquer coisa dá um bizu aqui. Lá eu faço esse auto relacionamento. Quando salvo um contato, relacione ele com ele mesmo e seleciono o contato de uma combo box.

Sucesso e bom estudo minha aluna.

https://github.com/flaviohenriquealmeida/mean-livro-codigo/blob/master/cap-07/public/partials/contato.html

Sem problema Flávio! Entendido! Agora tenho que fazer minha parte aqui e implementar o código! Obrigado pela paciÊncia!!

Ah! vou comprar seu livro! =) https://www.casadocodigo.com.br/products/livro-cangaceiro-javascript

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software