0

我有一个从服务器获取项目列表的指令。

(function () { '使用严格';

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() {

        },

    };
   }]);
})();

“actionItemChecked”方法通过每行的按钮单击（ng-click）连接到 html。我希望能够提供一些动画，同时从数组（和屏幕）中删除它。据我了解，我应该使用链接进行 DOM 操作，但我不确定如何判断何时应该对它进行任何操作。

我应该在链接而不是控制器中有“actionItemChecked”方法吗？如果是这样，它如何连接到每一行？

我看过

如何使用指令在angularjs内的列表中添加和删除项目时触发jquery动画？

和

删除元素时的angularJS通知

但看不到该怎么做。

4

1 回答 1

0

@charlietfl 回答了我的问题。我没有意识到当从控制器中的数组中删除一个项目时，它实际上将 ng-leave 应用于 ng-repeat 项目。然后我可以使用 CSS 来设置离开的样式。

于 2014-12-08T15:33:22.490 回答