express app.delete не вызывается и не отображается в коде консоли

Question

У меня есть эта проблема, почему эти данные не удаляются, также не отображается никаких сообщений в журнале консоли бэкэнда кода, я думаю, что это проблема с подпиской, но в примере я видел, что есть То же самое написано в моем коде, ммм, я надеюсь, что могу решить эту проблему, вот код:

list-tags.component. html

 <!-- Created Column -->
            <ng-container matColumnDef="delete">
              <mat-header-cell *matHeaderCellDef>Eliminar</mat-header-cell>
              <mat-cell *matCellDef="let row">
                <span class="select-item">
                  <button type="button" (click)="deleteTag(row.id)" class="btn btn-primary">
                    <i class="fa fa-trash-o"  aria-hidden="true"></i>
                  </button>
                </span>
              </mat-cell>
            </ng-container>

list-tags.components. ts

import { MatPaginator } from '@angular/material/paginator';
import { TagsService } from './../../../../services/tags.service';
import { Tag } from './../../../../models/tag';
import { Component, OnInit, ViewChild } from '@angular/core';
import { Subscription } from 'rxjs';
import { MatSort } from '@angular/material/sort';
import { MatTableDataSource } from '@angular/material/table';

@Component({
  selector: 'app-list-tags',
  templateUrl: './list-tags.component.html',
  styleUrls: ['./list-tags.component.css']
})
export class ListTagsComponent implements OnInit {

  @ViewChild(MatPaginator, {static: false}) paginator: MatPaginator;
  @ViewChild(MatSort, {static: false}) sort: MatSort;

  public displayedColumns: string[]
  public resultsLength: number;
  dataSource: MatTableDataSource<Tag>;

  public tags: Tag[];
  private tagsSub: Subscription;

  constructor(public tagsService: TagsService) {

    this.displayedColumns = ['content', 'created', 'edit', 'delete'];
    this.resultsLength = 0;
    this.tags = [];
   }

  ngOnInit() {
    this.tagsService.getTags();
    this.tagsSub = this.tagsService.getTagsUpdateListener()
    .subscribe((tags: Tag[]) => {
      this.tags = tags;
      this.dataSource = new MatTableDataSource(this.tags);
      this.resultsLength = this.tags.length;
      this.dataSource.sort = this.sort
      this.dataSource.paginator = this.paginator;
    })

  }

  ngOnDestroy(){
    this.tagsSub.unsubscribe();
  }

  editTag(tag: any){
    console.log(tag)
  }

  deleteTag(tagId: string){
    console.log(tagId)
    this.tagsService.deleteTag(tagId);
  }

tags.service.ts

import {map} from 'rxjs/operators';
import { Tag } from './../models/tag';
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Subject } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class TagsService {

  deleteTag(tagId: string) {
    this.http.delete("http://localhost:3000/api/tags/" + tagId)
      .subscribe(() => {
        const updatedTags = this.tags.filter(tag => tag.id !== tagId);
        this.tags = updatedTags;
        this.tagsUpdated.next([...this.tags]);
      })
  }

backend / app. js

const express = require('express');
const bodyParser = require("body-parser");
const mongoose = require('mongoose');

const Work = require("./models/work");
const Tag = require("./models/tags");

const app = express();

mongoose.connect("mongodb://localhost:27017/QCdb")
.then(() =>{
    console.log('Connected to database');
})
.catch(() => {
    console.log("Error to connected database")
});

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

app.use((req, res, next) => {
    res.setHeader("Access-Control-Allow-Origin", "*");
    res.setHeader(
      "Access-Control-Allow-Headers",
      "Origin, X-Requested-With, Content-Type, Accept"
    );
    res.setHeader(
      "Access-Control-Allow-Methods",
      "GET, POST, PATCH, DELETE, OPTIONS"
    );
    next();
  });

app.delete("/api/tags/:id", (req, res, next) => {
    console.log("here not showing log...")
    try{
        Tag.deleteOne({ _id: req.params.id }).then(result => {
            console.log(result);
            res.status(200).json({ message: "Tag deleted!" });
        })
    }catch(error){
        console.error(error);
    }
});

Я продолжу поиск, большое спасибо много людей, которые могут дать мне представление о том, что происходит в коде.

---

Я нашел что-то, я обнаружил, что API работает, но, только когда я поставил next (), после отображения данные.

app.use("/api/tags", (req, res, next) => {
    try{
        Tag.find().then(documents => {
            res.status(200).json({
                message: "posts fetched successfully",
                tag: documents
            });
        });
        next();  
    } catch(error){
        console.error(error);
    }
});

С этим методом next () я пытаюсь, но он ловит другую ошибку, и не может отобразить данные, позже действия удаления, если я удаляю этот метод next (), route.delete () не работает, и попытался решить ту же проблему оригинального сообщения

Answer 1

Я разрешаю это !! наконец-то. проблема в

Вот исходный код получения данных.

app.use("/api/tags", (req, res, next) => {
    try{
        Tag.find().then(documents => {
            res.status(200).json({
                message: "posts fetched successfully",
                tag: documents
            });
        });
    } catch(error){
        console.error(error);
    }
});

как это работает просто, измените использование, для получения.

app.get("/api/tags", (req, res, next) => {
    try{
        Tag.find().then(documents => {
            res.status(200).json({
                message: "posts fetched successfully",
                tag: documents
            });
        });
    } catch(error){
        console.error(error);
    }
});

почему? не знаю, пора читать немного DO C