如何在与node.js成角度的表格中上/下移动行并在数据库中更新?

时间:2018-08-04 07:39:45

标签: node.js angular

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的初学者。

1 个答案:

答案 0 :(得分:0)

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和向上/向下索引(通过交换数据库中的索引)获取详细信息,使数据库中的一列称为索引,并使用该列向上/向下(希望如此)