node.js - 如何在与node.js成 Angular 表格中上/下移动行并在数据库中更新？

Question

category.component.html（上下垫卡的HTML代码）

<button mat-mini-fab color="primary" (click)="moveUp(categoryObj,index)"><mat-icon>keyboard_arrow_up</mat-icon></button>
<button mat-mini-fab color="primary" (click)="moveDown(categoryObj,index)"><mat-icon>keyboard_arrow_down</mat-icon></button>

category.component.ts（使用索引的打字稿代码）

moveUp(categoryObj,index) {
    if (index > 0) {
        var tmp = this.categoryObj[index - 1];
        this.categoryObj[index - 1] = this.categoryObj[index];
        this.categoryObj[index] = tmp;
    }
    this.categoryService.upDownIndexes(this.categoryObj[index]).subscribe(
     (data) => {
       if(data.status == 14){
         this.categoryObj = data.payload;
       }
      }
    )  

}

moveDown(categoryObj,index) {
    if (index < this.categoryObj.length - 1) {
        var tmp = this.categoryObj[index + 1];
        this.categoryObj[index + 1] = this.categoryObj[index];
        this.categoryObj[index] = tmp;
    }
}

category.service.ts

     upDownIndexes(param){
      return this.http.post('http://localhost:3000/upDownIndexes',param).map((res: any) => res.json());
     }

app.js（node.js代码）

    app.post('/upDownIndexes',function(req,res){
    connection.query('UPDATE category SET indexes = CASE WHEN indexes = "?" THEN "?" WHEN indexes = "?" THEN "?" END WHERE indexes IN (?, ?) ',[req.body.index],function (error, results, fields) {
     if (error) throw error;
     res.send({
      'status':'14',
      'success': 'true',
      'payload': results,
      'message':'category is updated'
    });
   });
  });

该代码适用于上/下操作，但带有刷新页面，因此该代码不起作用，因此如何使用node.js将索引更新到（mysql-phpmyadmin）数据库，请为此提供帮助，我是angular和node的初学者

Answer 1

category.component.ts

  moveUpLanguage(languageObj,index) {
  if (index > 0) {
   var tmp = this.languageObj[index - 1];
   this.languageObj[index - 1] = this.languageObj[index];
   this.languageObj[index] = tmp;
   this.categoryService.moveUpLanguages({'id1':this.languageObj[index].id,
  'indexes1':this.languageObj[index].indexes,'id2':this.languageObj[index-1].id,
  'indexes2':this.languageObj[index - 1].indexes,'languagetitle1':this.languageObj[index].languagetitle,
 'languageimage1':this.languageObj[index].languageimage,'languagetitle2':this.languageObj[index - 1].languagetitle,
 'languageimage2':this.languageObj[index - 1].languageimage,
  }).subscribe(
   (data) => {
     if(data.status == 19){ 
       data.payload;
     }
    }
   )}
  }
  moveDownLanguage(languageObj,index) {
  if (index < this.languageObj.length - 1) {
    var tmp = this.languageObj[index + 1];
    this.languageObj[index + 1] = this.languageObj[index];
    this.languageObj[index] = tmp;
    this.categoryService.moveDownLanguages({'id1':this.languageObj[index].id,
   'indexes1':this.languageObj[index].indexes,'id2':this.languageObj[index+1].id,
   'indexes2':this.languageObj[index + 1].indexes,'languagetitle1':this.languageObj[index].languagetitle,
 'languageimage1':this.languageObj[index].languageimage,'languagetitle2':this.languageObj[index + 1].languagetitle,
 'languageimage2':this.languageObj[index + 1].languageimage,
  }).subscribe(
   (data) => {
     if(data.status == 20){ 
      data.payload;
     }
    }
   )}
 }

app.js（节点端代码）

  app.post('/moveUpLanguages',function(req,res){
  console.log(req.body);
  connection.query('UPDATE languages SET languagetitle = ?, languageimage = ?,indexes = ?  WHERE id= ?;UPDATE languages SET languagetitle = ?, languageimage = ? , indexes = ? WHERE id= ?',[req.body.languagetitle1,req.body.languageimage1,req.body.indexes2,req.body.id1,req.body.languagetitle2,req.body.languageimage2,req.body.indexes1,req.body.id2], function (error, results, fields) {
   if (error) throw error;
   res.send({
     'status':'19',
     'success': 'true',
     'payload': results,
     'message':'category is updated'
    });
  });
 });

  app.post('/moveDownLanguages',function(req,res){
   console.log(req.body);
   connection.query('UPDATE languages SET languagetitle = ?, languageimage = ?,indexes = ?  WHERE id= ?;UPDATE languages SET languagetitle = ?, languageimage = ? , indexes = ? WHERE id= ?',[req.body.languagetitle1,req.body.languageimage1,req.body.indexes2,req.body.id1,req.body.languagetitle2,req.body.languageimage2,req.body.indexes1,req.body.id2], function (error, results, fields) {
   if (error) throw error;
   res.send({
     'status':'20',
     'success': 'true',
     'payload': results,
     'message':'category is updated'
    });
   }); 
  });

在获取详细信息的节点中，使用ORDER BY和向上/向下索引（通过交换数据库中的索引）获取详细信息，使数据库中的一列称为索引，并使用该列向上/向下进行索引（希望如此）