angularjs 지시어로 아이템 목록을 보여줍니다 - 버튼을 통한 아이템 제거를 움직이기 원합니다. 해당 행을 클릭하십시오.

Question

서버에서 항목 목록을 가져 오는 지시문이 있습니다.

(함수() { '가 엄격한 사용']. ​​

는 "actionItemChecked"방법은 각 행의 버튼 클릭 (NG 클릭)을 통해 HTML에 매여

angular.module('app').directive('myActionItems', ['ActionService', function (ActionService) { 

    return { 
     restrict: 'E', 
     scope: { 

     }, 
     controllerAs: "vm", 
     templateUrl: '/app/home/myActionItems.html', 

     controller: function ($scope) { 
      var vm = this; 
      vm.busy = false; 

      vm.actions = [];     
      vm.actionItemChecked = actionItemChecked; 

      activate(); 

      function activate() { 
       refresh(); 
      } 

      function refresh() {     
       vm.actions = []; 
       vm.busy = true; 
       ActionService.getMyActionItems().then(function (result) { 
        vm.actions = result; 
       }) 
       .finally(function() { 
        vm.busy = false; 
       }); 
      } 

      function actionItemChecked(action) { 
       //submit to server to complete it 
       ActionService.markActionItemComplete(action.id) 
        .then(function(result) { 
         //on success remove it from the list. 
         if (result !== undefined && result != null && result.succeeded) { 
          vm.actions = _.without(vm.actions, _.findWhere(vm.actions, { id: action.id })); 
         } 
        }); 

      } 

     }, 

     link: function() { 

     }, 

    }; 
    }]); 
})(); 

I이 원하는 배열 (및 화면)에서이 애니메이션을 제거하는 동안 일부 애니메이션을 제공 할 수 있습니다. DOM 조작에 대한 링크를 사용해야한다는 것을 이해하지만, 언제 내가 그걸로 무엇을해야 하는지를 어떻게 알 수 있는지 알 수는 없습니다.

컨트롤러가 아닌 링크에 "actionItemChecked"메서드가 있어야합니까? 그렇다면 어떻게 각 행에 연결될 것입니까?

나는

How to use directive to trigger jquery animation on both add and remove item in a list inside angularjs?

및

angularJS notification when element is removed

살펴 보았다하지만 캔트 그것을 수행하는 방법을 참조하십시오.

Answer 1

@charlietfl이 내 질문에 답변했습니다. 컨트롤러에서 배열의 항목을 제거 할 때 실제로 ng-repeat 항목에 ng-leave 항목을 적용한다는 것을 알지 못합니다. 그런 다음 CSS를 사용하여 이탈을 스타일링 할 수 있습니다.