Quando entra no componente.html de PhotoDetails, ele consegue mostrar a foto , mas primeiro realiza uma requisição, onde mostra no console "http://localhost:3000/imgs/null 404 (Not Found)" Mas mesmo assim a imagem consegue carregar. Que tipo de erro seria esse? Já que a foto consegue ser exibida, é como se ele primeiro fizesse uma requisição que não encontrasse nada nem id, e ai sim depois que tem o id ele mostrasse a foto.
Fala aí Nilton, tudo bem? Bom, precisaria ver os códigos e entender melhor o que você está fazendo nos componentes e serviços.
Falando assim por cima é complicado.
Provavelmente você está esperando receber algum parâmetro para realizar a request, porém, o mesmo não é passado.
Espero ter ajudado.
O problema foi solucionando adotando o Observable. Mas tenho uma dúvida, quando adotar realmente o Observable? Quando é necessário fazer por exemplo um
_photo = Observable<Photo>fez-se isso no compent e no template usou ' | assync '.
Nos capítulos anteriores, na construção do footer, vi que no componente ele também usou o Observable em user para retornar o usuário e fazer o ' | async ' no ng if do template, para exibir o footer caso o usuario estivesse logado.
E aproveitando o post para realizar outra pergunta e sanar minha dúvida é em relação ao upload de imagem. Ficou meio implícito pra mim como ele relaciona a foto e os componentes (description e allowcomments) com o usuário que fez o envio. No component ele apenas faz um post dos dados do formulário, sem informar explicitamente onde ele 'linkaria' por exemplo "Ah essa foto é desse usuário que estar enviando" .
Abri a API Node e vi que lá existe um método que faz o envio da foto recebendo um "req". Acredito que ai ele faça a combinação foto com o usuário que está logado, mas como no meu front end faz essa comunicação ? Através do token logado ?
api.addUpload = async (req, res) => {
console.log('upload complete');
console.log('Photo data', req.body);
console.log('File info', req.file);
const image = await jimp.read(req.file.path);
await image
.exifRotate()
.cover(460, 460)
.autocrop()
.write(req.file.path);
const photo = req.body;
photo.url = path.basename(req.file.path);
await new PhotoDao(req.db).add(photo, req.user.id);
res.status(200).end();
};Fala aí Nilton, tudo bom? Geralmente definimos uma propriedade (atributo) da classe como Observable quanto queremos que o Angular seja o responsável por sua renderização assim que o mesmo for resolvido e finalizado.
Isso é feito através do async pipe, ele consegue lidar com Observable's e os renderiza quando estiverem disponíveis.
Do contrário você não ia ter essa possibilidade de usar o async.
Espero ter ajudado.