2
respostas

criar o serviço de delete - Angular

Estou tentando criar a opção de deletar comentarios , do curso: angular-controle-fluxo-navegacao. Eu só consigo apagar todos comentarios de uma vez, quero excluir apenas o target que eu clicar .

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

2 respostas

FRONTEND

comentarios.service.ts

 deleteComentario(id:number): Observable<string>{
    return this.http.delete<string>(`${API}/comments/${id}`);
 }

comentarios.component.ts

excluir(comentario: Comentario) : void{
    this.comentarios$ =
    this.comentariosService.deleteComentario(comentario.id)
      .pipe(
      switchMap(() => this.comentariosService.buscaComentario(this.id))
    );
}    

comentarios.component.html

<li *ngFor="let comentario of comentarios">
  <p class="text-dark font-weight-bold mr-1">{{ comentario.userName }}</p>
  <em>{{ comentario.date | date: "dd-MM-yyyy HH:mm" }}</em>
  <p class="break-word mb-2">{{ comentario.text }}</p>
  <span (click)="excluir(comentario)" class="fa fa-trash-o fa-2x"></span>
</li>

BACKEND

api/comment.js

api.deleteComment = async (req, res) => {
     const commentId = req.params['id'];
     try {
           const comment = new CommentDao(req.db).deleteById(commentId) ;
           console.log(`Comment  deleted!`, comment);
           res.json(`Comment deleted: ${comment}`);
        } catch(e) {
            res.status(403).json({ message: 'Forbiden'});
        }
};

routes/comment.js

    app.route('/comments/:id')
        .delete(auth, wrapAsync(commentAPI.deleteComment));    

infra/comment-dao.js

const commentConverter = row => ({
    id:row.comment_id,
    date: row.comment_date,
    text: row.comment_text,
    userName: row.user_name
})

listAllFromPhoto(photoId) {

        return new Promise((resolve, reject) => {
            this._db.all(
                `
                SELECT
                     c.comment_id, c.comment_date, c.comment_text, u.user_name
                FROM comment as c
                    JOIN user as u ON u.user_id = c.user_id
                WHERE c.photo_id = ?
                ORDER BY c.comment_date DESC
                `,
                [photoId],
                (err, rows) => {

                    if (err) {
                        console.log(err);
                        return reject('Can`t load comments');
                    }
                    const comments = rows.map(commentConverter);
                    return resolve(comments);
                }
            );

        });
    }

    findById(commentId) {

        return new Promise((resolve, reject) => {
            this._db.get(
                `
                SELECT
                    c.comment_date, c.comment_text, u.user_name
                FROM comment as c
                    JOIN user as u ON u.user_id = c.user_id
                WHERE c.comment_id = ?
                `,
                [commentId],
                (err, row) => {
                    console.log(row);
                    if (err) {
                        console.log(err);
                        return reject('Can`t load comment');
                    }
                    return resolve(commentConverter(row));
                }
            );

        });
    }

  deleteById(commentId) {

        return new Promise((resolve, reject) => {
            this._db.get(
                `
                DELETE FROM comment as c
                WHERE c.comment_id = ?
                `,
                [commentId],
                (err, row) => {
                    console.log(row);
                    if (err) {
                        console.log(err);
                        return reject('Can`t delete comment');
                    }
                    return commentId;
                }
            );
        });
    }

https://github.com/lyndontavares/angular-alura-controle-fluxo

Está apagando todos os comentarios de uma vez , porém gostaria de apagar apenas no alvo que eu clicar. Mas muito obrigado, ajudou bastante.