programing

Angular 배열에서 항목을 제거하는 방법JS 스코프?

muds 2023. 2. 25. 22:25
반응형

Angular 배열에서 항목을 제거하는 방법JS 스코프?

간단한 작업관리 목록이지만 각 항목의 목록 페이지에 삭제 버튼이 있습니다.

여기에 이미지 설명 입력

관련 템플릿 HTML:

<tr ng-repeat="person in persons">
  <td>{{person.name}} - # {{person.id}}</td>
  <td>{{person.description}}</td>
  <td nowrap=nowrap>
    <a href="#!/edit"><i class="icon-edit"></i></a>
    <button ng-click="delete(person)"><i class="icon-minus-sign"></i></button>
  </td>
</tr>

관련 컨트롤러 방법:

$scope.delete = function (person) {
  API.DeletePerson({ id: person.id }, function (success) {
    // I need some code here to pull the person from my scope.
  });
};

나는 노력했다.$scope.persons.pull(person)그리고.$scope.persons.remove(person).

데이터베이스가 성공적으로 삭제되었지만 이 항목을 범위에서 가져올 수 없으며 클라이언트가 이미 가지고 있는 데이터에 대해 서버에 메서드 호출을 하고 싶지 않습니다. 이 한 사람을 범위에서 삭제하려고 합니다.

좋은 생각 있어요?

의 인덱스를 찾아야 합니다.person당신의 안에서persons어레이의 방법을 사용합니다.

$scope.persons.splice( $scope.persons.indexOf(person), 1 );

문제는 Angular가 아니라 Array 메서드에 있습니다.배열에서 특정 항목을 삭제하는 적절한 방법은 를 사용하는 것입니다.또, ng-repeat 를 사용하면, 스페셜에 액세스 할 수 있습니다.$index속성 - 전달한 배열의 현재 인덱스입니다.

해결책은 실제로 매우 간단합니다.

표시:

<a ng-click="delete($index)">Delete</a>

컨트롤러:

$scope.delete = function ( idx ) {
  var person_to_delete = $scope.persons[idx];

  API.DeletePerson({ id: person_to_delete.id }, function (success) {
    $scope.persons.splice(idx, 1);
  });
};

유용한 기능 목록이 있는 Underscore.js 라이브러리를 사용합니다.

without

without_.without(array, *values)

모든 값 인스턴스가 제거된 어레이의 복사본을 반환합니다.

_.without([1, 2, 1, 0, 3, 1, 4], 0, 1);
// => [2, 3, 4]

var res = "deleteMe";

$scope.nodes = [
  {
    name: "Node-1-1"
  },
  {
    name: "Node-1-2"
  },
  {
    name: "deleteMe"
  }
];
    
$scope.newNodes = _.without($scope.nodes, _.findWhere($scope.nodes, {
  name: res
}));

JSFiddle의 데모를 참조하십시오.


filter

var evens = _.filter([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });

// => [2, 4, 6]

$scope.newNodes = _.filter($scope.nodes, function(node) {
  return !(node.name == res);
});

바이올린 데모를 참조하십시오.

$scope.removeItem = function() {
    $scope.items.splice($scope.toRemove, 1);
    $scope.toRemove = null;
};

이건 나한테 효과가 있어!

목록에 연결된 함수가 있는 경우 스플라이스 함수를 만들면 연관성도 삭제됩니다.솔루션:

$scope.remove = function() {
    var oldList = $scope.items;
    $scope.items = [];

    angular.forEach(oldList, function(x) {
        if (! x.done) $scope.items.push( { [ DATA OF EACH ITEM USING oldList(x) ] });
    });
};

목록 매개 변수는 명명된 항목입니다.파라미터 x.done은 아이템의 삭제 여부를 나타냅니다.

다른 참고 자료:또 다른 예

도움이 되길 바랍니다.인사말.

승인된 @Joseph Silber의 경우 indexOf가 -1을 반환하기 때문에 동작하지 않습니다.이것은 아마도 Angular가 해시키를 추가했기 때문일 것입니다.이것은 제 $scope.items[0]와 제 아이템에 대해 다릅니다.각도로 해결하려고 했어요.toJson() 함수는 동작하지 않았습니다.

아, 그 이유를 알았어...청크 방식을 사용하여 $scope.items를 보고 테이블에 두 개의 열을 만듭니다.미안!

이것도 사용할 수 있습니다.

$scope.persons = $filter('filter')($scope.persons , { id: ('!' + person.id) });

앵귤러에는 다음과 같은 함수가 내장되어 있습니다.arrayRemove이 경우 방법은 다음과 같습니다.

arrayRemove($scope.persons, person)
array.splice(array.pop(item));

스코프에서 요소를 제거하려면:

// remove an item
    $scope.remove = function(index) {
        $scope.items.splice(index, 1);
    };

여기에 링크 설명을 입력하십시오.

언급URL : https://stackoverflow.com/questions/14250642/how-to-remove-an-item-from-an-array-in-angularjs-scope

반응형