각도 js에서 Json 객체의 데이터를 삭제하는 방법은 무엇입니까?

Question

Angular JS에서 요소를 삭제하려고합니다. 사용자가 동작 버튼을 클릭하면 카드보기가 삭제되지만 HTML보기에서는 삭제되지 않지만 백엔드 노드에서는 & DB 데이터가 삭제되었습니다. 내가 엘리먼트를 새로 고침했을 때 HTML에서 버튼을 클릭하면 카드보기가 삭제되고 DB에서도 삭제됩니다. Pls이 내가이 문제를 해결하는 데 도움이?

HTML보기

<md-card ng-repeat="user in data" class="color" ng-style="user.changeColor"> 
    <md-card-title> 
     <md-card-title-text style=""> 
      <span class="md-headline">Name:{{user.name}}</span> 
      <span class="md-headline">Mobile:{{user.mobile_no}}</span> 
     </md-card-title-text> 
    </md-card-title> 

    <md-input-container> 
     <label>Meter ID</label> 
     <input ng-model="meter" required md-maxlength="10" type="text" > 
    </md-input-container> 

    <md-button class="color1" ng-click="meterID(user,meter)" > 
      Action 
    </md-button> 
</md-card> 

각도 JS 코드

.controller('userCtrl',function($scope,$rootScope,$http){ 
    $scope.test="Hello Raam" 
    $scope.meter; 

    $http.get('http://localhost:8888/json').success(function(response){ 
     $scope.data=response; 
     console.log($scope.data) 
    }) 

    $scope.meterID=function(user,meter,x){ 
     console.log("User",user);  
     console.log("Meter",meter) 

     user.changeColor={ 
      "background-color":"green",   
     } 
     console.log(user.name); 

     $scope.userMeter={   
      name:user.name, 
      mobile:user.mobile_no, 
      appartment:user.appartment, 
      street:user.street, 
      city:user.city, 
      pincode:user.pincode, 
      meterID:meter 
     } 

     console.log("UserMeter",$scope.userMeter); 


      $http.post('http://localhost:8888/meterID',$scope.userMeter).success(function(response){ 
       console.log("value has been successfully updated"); 
       $scope.data1=response; 
       console.log("$scope.data1",$scope.data1) 
      }) 

      $http({ 
       method: 'DELETE', 
       url: 'http://localhost:8888/deleteRegisterUser', 
       data: user, 
       headers: {'Content-Type': 'application/json;charset=utf-8'} 
      }).success(function (data, statusText){ 
        console.log("value has been successfully Deleted",data); 

       }) 
      } 
}) 

NodeJS :

app.delete('/deleteRegisterUser', function(req,res){ 
      var mob=req.body.mobile_no; 
       console.log("deleteRegisterUser : ",mob) 
       // res.send(data) 
      con.query("DELETE from water_register WHERE mobile_no = ?",mob,function (err,rows){ 
       if(err) throw err; 
       console.log("Value has been deleted") 
       // res.send(rows); 
       res.redirect('/dashboard'); 
      }) 
    }) 

Answer 1

당신은 $ scope.data에서 요소를 제거하지 않는, 즉에서 소스 배열입니다 너의 반복.

나는 당신이 당신의 NG 반복에 필터를 사용하지 않는 것을 볼, 그래서 당신은 두 가지 옵션이 있습니다

1. 가 매개 변수로 인덱스를 받고 배열의 대응 ​​항목을 제거 하나 개의 함수를 만들기를 :

   $ scope.remove = function (index) { $ scope.data.splice (index, 1); }

그리고 당신에 그 함수를 호출 ng를 클릭 :

<md-button class="color1" ng-click="meterID(user,meter); remove($index)" > 

1. 단순히 기능을 meterID에 매개 변수로 인덱스를 통과에서 항목을 제거 $ scope.data 거기에

필터를 사용하지 않는 경우에만 인덱스를 전달하는 것이 좋습니다. 그러면 인덱스 대신 제거 함수에 개체를 전달하고 같이 IndexOf :

$scope.remove = function (item) { 
    $scope.data.splice($scope.data.indexOf(item), 1); 
} 

그리고 매개 변수로 항목을 전달하는이 함수를 호출 :

<md-button class="color1" ng-click="meterID(user,meter); remove(user)" > 

Answer 2

가 확실하지 이해 함수는 $scope.meterID

당신은 모두 갱신을 호출하고 동일한 기능에서 삭제된다. 어쨌든, 후 이 http.post 방법에

//after $http.post (method: DELETE) .... 

$http.get('http://localhost:8888/json').success(function(response){ 
    $scope.data=response; 
    console.log($scope.data) 
}) 

또한 백엔드에서 업데이트 된 기록 목록을 가져올 또 다른 'HTTP GET'전화를, 당신의 $scope.data에서 항목을 삭제, 당신은 가치를 seeting된다 $ scope.data1. data1은 무엇이며 어디에서 사용하고 있습니까? 나는 그것이 오히려 있어야한다고 생각합니다

$scope.data=response; 
console.log("$scope.data ",$scope.data)enter code here