1

我正在制作一个迷你联系人列表，我正在尝试实现拖放效果。现在我有一个控制器，它可以从数据库中给我带来数据，看起来像这样。

Index.controller('cIndex', function($scope, $http) {
    $scope.init = function() {
        $http.get('php/contacts.php').success(function(data) {
            $scope.jsonContactsList = data;
            $scope.jsonContactsDetail = [];
        });
    };
    $scope.init();

    $scope.listdetail = function(index) {
        alert(index);
    };
});

这个控制器在屏幕上添加了一个联系人列表。我想这样做，当我从列表中拖动一个项目并将其放到列表之外时，该项目将从列表中消失并显示为有关该特定联系人的详细 div。

现在我有 2 个指令，1 个产生拖动效果，1 个产生拖放效果，它们看起来像这样。

Index.directive('contactListDrag', function() {
    return {
        restrict: 'A',
        link: function(scope, elem, attr) {
            var options = scope.$eval(attr.contactListDrag);
            elem.draggable(options);
        }
    };
});

Index.directive('contactListDrop', function() {
    return {
        restrict: 'A',
        link: function(scope, elem, attr) {
            elem.droppable({accept: '.contact-list-item'});
            elem.bind('drop', function(event, ui) {
                var id = parseInt($(ui.draggable).attr('id'), 10);
                $scope.listdetail(id);
            });
        }
    };
});

现在在控制器内部，我有一个名为 listdetail 的函数，我打算让它将 jsonContactsList 中的一行更改为 jsonContactsDetail，但为了做到这一点，我需要在可放置的 contactListDrop 指令中从控制器调用 listdetail 函数。

提前谢谢你，丹尼尔！

4

2 回答 2

2

我找到了解决方法，我不得不使用 scope.listdetail(id); 没有美元符号。

于 2013-08-31T12:37:11.963 回答
0

$scope在您的指令中不可用。你需要告诉你的指令关于它的父母。在此处查看 Angular 文档中有关理解嵌入和范围的部分：http: //docs.angularjs.org/guide/directive

scope: {
    var: '='
}

您还可以从您的指令中使用scope.$emit一个事件，并使用$scope.$on在控制器中监听它- 我认为这是更好的解决方案，因为您的指令不会与具有特定功能的控制器绑定。

于 2013-08-31T12:42:30.460 回答