각도가있는 배열에서 항목 제거

Question

예, 이전에 질문을 받았지만 모든 대답을 읽었지만 아무 것도 작동하지 않는 것 같습니다. 그래서 나는 눈의 여분의 쌍을 물어보고 당신이 내 코드에서 어떤 특이점을 찾을 수 있는지 알아봐야한다. (나는이 코드와 논리를 다른 곳에서 시도해 보았지만 제대로 작동하는 것으로 보인다). 콘솔에 오류가 없습니다.

누군가가 그림에서 x를 클릭하면보기에서 항목을 제거하려고합니다. 내가 제대로 질문을 이해하면 삭제할 경우 여기

는

<div class="col-xs-12 col-md-3" ng-repeat="gallery in galleries" > 
    <a class="gallery-item" ng-href="{{gallery.img}}" ng-class="{true:'active',false:''}[checked]" 
     title="Nature Image 1" > 
     <div class="image"> 
      <img ng-src="{{gallery.img}}" alt="Nature Image 1"/> 

     </div> 
     <div class="meta"> 
      <strong>{{gallery.title}}</strong> 
      <span>{{gallery.desc}}</span> 
     </div> 
    </a> 
    <ul class="gallery-item-controls"> 
     <li><label class="check"><input type="checkbox" class="icheckbox" ng-model="checked" /></label></li> 
     <li><span class="gallery-item-remove"><i class="fa fa-times" ng-click="removeGalleryItem(gallery)"></i></span></li> 
    </ul> 
</div> 

각도 1.5.8

감사

Answer 1

이와 같이 클릭 기능에 $index을 전달할 수 있습니다. 당신의 클릭 기능 removeGalleryItem 내부

<i class="fa fa-times" ng-click="removeGalleryItem(galleryItem, $event , $index)"> 

및 사용 $scope.galleries.splice(index, 1);, 당신도이 같은 인덱스 매개 변수가 있는지 확인하십시오. 이 도움이

$scope.removeGalleryItem = function(gallery , event, index){ 
     $scope.galleries.splice(index, 1); 
    }; 

희망 ..

Answer 2

컨트롤러

app.controller('galleryController', ['$scope', '$http', function($scope, $http) { 
    $http.get('data/galleries.json').success(function(data){ 
     $scope.galleries = data; 
    }).error(function(error) { 
     console.log(error); 
    }); 

    $scope.removeGalleryItem=function(gallery){ 
     var removedGallery = $scope.galleries.indexOf(gallery); 
     $scope.galleries.splice(removedGallery, 1); 
    }; 
}]); 

내이다 이러한 특정 요소를 포함하는 DOM과 Array의 특정 요소는 fo llowing :

<!-- Intercept that particular Element with $event--> 
<i class="fa fa-times" ng-click="removeGalleryItem(galleryItem, $event)"> 

일부 galleryItems를 반복하고 있다고 가정하고 이름 속성을 갖습니다.

그리고 컨트롤러에

:

$scope.removeGalleryItem(galleryItem, $event){ 
    //Save galleryItem Name 
    var itemName = $($event.currentTarget).name(); // if it has it on html 
    var itemName = galleryItem.name; // if it has a property 
    //Get the target and remove it 
    $($event.currentTarget).remove(); 

    //Using lodash, loop through your array and remove that exact object from it. 
    //Ofc you can do a normal loop through it. 
    $scope.galleries = _.remove($scope.galleries, function(n) { 
     return n != itemName; 
    }); 

    //Then, if the change does not happen in your DOM 
    $scope.$apply(); 

} 

희망 내가 도움이있었습니다.

Answer 3

몇 가지 조사를하고 난 후에 나는 문제가 galleryController이 마크 업 어딘가에 정의되어 있지만 갤러리의 요소는 해당 컨트롤러가 정의되는 위치에 있지 있다고 생각 .

http://joli.sitedev.online/#/gallery을 참조하십시오. 파일 slidesController에 있습니다.JS galleryController 내가 여기 휴식을 넣어 정의하고 코드가 일시 정지 여기서

내가 여기 중단 점을 넣어하지만, 삭제 버튼을 클릭하면 코드가 일시 정지하지 않습니다

내가 ng-controller="galleryController"의 흔적을 볼 수없는 마크 업을 보면 는

그래서 ng-repeat에서 갤러리가 채워지는 볼 수 없습니다 :

은 아마이 통해 :

하면 해당 통해 그 지시 자체 컨트롤러가 같은 다음 일을 설명한다면. 더 자세한 정보가 도움이 될 것이고 나는 이것을 분명히 할 수있을 것이라고 확신합니다.

Answer 4

this 문제를 해결하기 위해 몇 가지 변경을했으며 this 링크에서 확인할 수 있습니다.

여기서 문제는 removeGalleryItem(galleryItem, $event)을 호출하는 html 코드 조각에 오타가 있다는 것입니다. galleryItem이 아니기 때문에 galleryItem이 아니므로 galleryItem이 아니므로 galleryItem이 아닌 gallery이어야합니다. 따라서이 메서드 내부에서 매개 변수 값은 undefined입니다. 나는 그것을 고정되면, 나는 removeGalleryItem 메소드 내 갤러리 개체를 얻을 수 있었고, 다음 코드는 절대적으로 괜찮 았는데 :

$scope.removeGalleryItem=function(gallery){ 
    var selectedGallery = $scope.galleries.indexOf(gallery); 
    $scope.galleries.splice(selectedGallery, 1); 
}; 

은 또한 점에 유의, 나는 메소드 선언에서와에서 $ 이벤트 속성을 제거했습니다 html 메쏘드 호출을 사용했다.

<i class="fa fa-times" ng-click="removeGalleryItem(gallery)"></i>